/* Same Google Fonts families and weights, self-hosted; upstream CSS preserved. */
/* cyrillic-ext */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/d03ed930a7a3a874.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/d298ae083e7dbebb.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/db6e2c1d23fbf3aa.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/c08644f2297a9192.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/0ccff06de8d1b4d4.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;
}
/* latin-ext */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/90558169d20f79fe.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;
}
/* latin */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/198cbc2b88bef0be.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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/eb17aa1a0d91d778.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/76c13de3e84eec54.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/49ff3fe6fae94297.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/3d9cb091ce959b53.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/d80ea76187e5041d.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;
}
/* latin-ext */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/deeb9855fca173d7.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;
}
/* latin */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/d98461b656bdf1af.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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/97fbf3043e18450d.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/39c2e99202ee7cd7.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/3fdb53293fe973d8.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/e53370c1cf8fb249.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/d60302ef3af8419d.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;
}
/* latin-ext */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/4b361292eb43c144.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;
}
/* latin */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/58f2b464df018d23.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;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/a3f196ab4591e748.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/3f386f43d3b440ac.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/1f24502f81c74add.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/5b816e94f2997806.woff2) format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/8bff0c2dfa3f32a6.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;
}
/* latin-ext */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/e83dcd9ff66b2ec1.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;
}
/* latin */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/570652cb70eccafe.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;
}
/* vietnamese */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/a4c5fe4f4f21c29e.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;
}
/* latin-ext */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/7cdca5ec1a66e78b.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;
}
/* latin */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/6a8370661dae1863.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;
}
/* vietnamese */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/a4c5fe4f4f21c29e.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;
}
/* latin-ext */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/7cdca5ec1a66e78b.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;
}
/* latin */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/fonts/6a8370661dae1863.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;
}
/* vietnamese */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/a4c5fe4f4f21c29e.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;
}
/* latin-ext */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/7cdca5ec1a66e78b.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;
}
/* latin */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/fonts/6a8370661dae1863.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;
}
/* arabic */
@font-face {
  font-family: 'Scheherazade New';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/82cf3ba30c54f029.woff2) format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
/* latin-ext */
@font-face {
  font-family: 'Scheherazade New';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/a6cd3e6c0d8ad4e4.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;
}
/* latin */
@font-face {
  font-family: 'Scheherazade New';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/fonts/17e36614f4b5e455.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;
}
/* arabic */
@font-face {
  font-family: 'Scheherazade New';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/a3021be9e2e4735b.woff2) format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
/* latin-ext */
@font-face {
  font-family: 'Scheherazade New';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/be54f9e58ec25b19.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;
}
/* latin */
@font-face {
  font-family: 'Scheherazade New';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/fonts/5eca6379a93030b9.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;
}

/* tafsira.com — "modern tefsir kütüphanesi"
   Palet: kâğıt + zümrüt + bakır. Fontlar: Fraunces / Alegreya Sans / Scheherazade New */

:root {
  --kagit: #F8F6F0;
  --panel: #FFFFFF;
  --murekkep: #212822;
  --soluk: #5C665F;
  --zumrut: #0F5B47;
  --zumrut-koyu: #0A4235;
  --zumrut-tint: #E9F1EC;
  --bakir: #A4562F;
  --cizgi: #E3DFD3;
  --serif: "Fraunces", Georgia, serif;
  --sans: "Alegreya Sans", "Segoe UI", sans-serif;
  --arapca: "Scheherazade New", "Amiri", serif;
  --tekin-bosluk: 20px;
  --tekin-aralik: 12px;
  --tekin-okuma-genisligi: 1200px;
  --tekin-capa-boslugu: 90px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

[hidden] { display: none !important; }

html { scroll-behavior: smooth; overflow-anchor: none; }

body {
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.65;
  color: var(--murekkep);
  background:
    radial-gradient(1200px 500px at 85% -100px, #EFF4EF 0%, transparent 60%),
    var(--kagit);
}

a { color: var(--zumrut); text-decoration: none; }
a:hover { color: var(--bakir); }

h1, h2, h3 { font-family: var(--serif); font-weight: 600; line-height: 1.25; }

/* ---------------- üst bar ---------------- */
.ust {
  position: sticky; top: 0; z-index: 50;
  background: rgba(248, 246, 240, .92);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--cizgi);
}
.ust-ic {
  max-width: 1080px; margin: 0 auto; padding: 10px 20px;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.marka { display: flex; align-items: center; gap: 10px; }
.marka-simge { width: 34px; height: 34px; flex: none; }
.marka-ad {
  font-family: var(--serif); font-weight: 700; font-size: 24px;
  color: var(--murekkep); letter-spacing: -0.5px;
}
.marka:hover .marka-ad { color: var(--zumrut); }
.ust-linkler { display: flex; gap: 22px; font-weight: 500; align-items: center; }
.ust-linkler a { color: var(--murekkep); }
.ust-linkler a:hover { color: var(--zumrut); }

.menu-dugme {
  display: none; flex-direction: column; justify-content: center; gap: 5px;
  width: 44px; height: 44px; padding: 10px;
  background: var(--panel); border: 1px solid var(--cizgi); border-radius: 10px;
  cursor: pointer;
}
.menu-dugme span {
  display: block; height: 2px; border-radius: 2px;
  background: var(--murekkep); transition: transform .18s, opacity .18s;
}
.menu-acik .menu-dugme span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-acik .menu-dugme span:nth-child(2) { opacity: 0; }
.menu-acik .menu-dugme span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ---------------- kapak ---------------- */
.kapak { border-bottom: 1px solid var(--cizgi); }
.kapak-ic {
  max-width: 1080px; margin: 0 auto; padding: 56px 20px 48px;
  display: grid; grid-template-columns: 1.2fr .9fr; gap: 48px; align-items: center;
}
.kapak-ust {
  font-family: var(--arapca); font-size: 26px; color: var(--zumrut);
  margin-bottom: 14px;
}
.kapak h1 {
  font-size: clamp(34px, 5vw, 52px); font-weight: 700; letter-spacing: -1px;
  margin-bottom: 14px;
}
.kapak h1 em { font-style: italic; color: var(--zumrut); }
.kapak-alt { font-size: 19px; color: var(--soluk); max-width: 46ch; }
.arama { margin-top: 26px; }
.arama input {
  width: 100%; max-width: 460px; padding: 13px 18px;
  font: 500 17px var(--sans); color: var(--murekkep);
  background: var(--panel); border: 1.5px solid var(--cizgi); border-radius: 10px;
  outline: none; transition: border-color .15s, box-shadow .15s;
}
.arama input:focus {
  border-color: var(--zumrut);
  box-shadow: 0 0 0 4px rgba(15, 91, 71, .12);
}

.gunun-ayeti {
  background: linear-gradient(160deg, var(--zumrut) 0%, var(--zumrut-koyu) 100%);
  color: #F2F1E8; border-radius: 16px; padding: 26px 28px;
  box-shadow: 0 18px 40px -18px rgba(10, 66, 53, .55);
}
.ga-baslik {
  font-size: 13px; font-weight: 700; letter-spacing: 2.5px;
  text-transform: uppercase; color: #C9A227; opacity: .95; margin-bottom: 12px;
}
.ga-arapca {
  font-family: var(--arapca); font-size: 27px; line-height: 1.9;
  margin-bottom: 12px;
}
.ga-meal { font-style: italic; margin-bottom: 12px; }
.ga-kaynak { font-size: 15px; opacity: .85; }
.ga-kaynak a { color: #F2F1E8; text-decoration: underline; }

/* ---------------- gövde / bölümler ---------------- */
.govde { max-width: 1080px; margin: 0 auto; padding: 40px 20px; }
.bolum-baslik { font-size: 28px; margin-bottom: 22px; }
.bolum-baslik small {
  font-family: var(--sans); font-size: 15px; font-weight: 400;
  color: var(--soluk); margin-left: 10px;
}

.sure-izgara {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 10px;
}
.sure-kart {
  display: flex; align-items: center; gap: 12px;
  background: var(--panel); border: 1px solid var(--cizgi); border-radius: 10px;
  padding: 10px 14px; color: var(--murekkep);
  transition: transform .12s, border-color .12s, box-shadow .12s;
}
.sure-kart:hover {
  transform: translateY(-2px); border-color: var(--zumrut);
  box-shadow: 0 8px 20px -12px rgba(15, 91, 71, .4); color: var(--murekkep);
}
.sk-no {
  flex: none; width: 34px; height: 34px; border-radius: 50%;
  display: grid; place-items: center;
  background: var(--zumrut-tint); color: var(--zumrut);
  font-weight: 700; font-size: 14px;
}
.sk-metin { flex: 1; min-width: 0; line-height: 1.3; }
.sk-metin b { font-size: 16.5px; }
.sk-metin small { display: block; color: var(--soluk); font-size: 13px; }
.sk-ar { font-family: var(--arapca); font-size: 21px; color: var(--bakir); }
.bos-sonuc { color: var(--soluk); padding: 20px 0; }

.tanitim { border-top: 1px solid var(--cizgi); }
.uc-sutun { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.uc-sutun h3 { font-size: 20px; margin-bottom: 8px; color: var(--zumrut-koyu); }
.uc-sutun p { color: var(--soluk); }

/* ---------------- kırıntı + sure sayfası ---------------- */
.kirinti { font-size: 14.5px; color: var(--soluk); margin-bottom: 22px; }
.kirinti span { color: var(--murekkep); }

.sure-baslik { text-align: center; margin-bottom: 26px; }
.sb-ar { font-family: var(--arapca); font-size: 44px; color: var(--zumrut); line-height: 1.4; }
.sure-baslik h1, .ayet-baslik h1 { font-size: clamp(28px, 4vw, 40px); margin: 4px 0 8px; }
.sb-bilgi { color: var(--soluk); }

.ses-cubugu {
  display: flex; flex-wrap: wrap; gap: 14px; justify-content: center;
  margin-top: 18px;
}
.ses-blok {
  background: var(--panel); border: 1px solid var(--cizgi); border-radius: 10px;
  padding: 8px 14px; display: flex; align-items: center; gap: 10px;
}
.ses-blok span { font-size: 13px; font-weight: 700; letter-spacing: .5px;
  text-transform: uppercase; color: var(--soluk); white-space: nowrap; }
.ses-blok audio { height: 36px; max-width: 240px; }
.ses-blok.tekli { margin: 14px auto 0; justify-content: center; }
.ses-blok { flex-wrap: wrap; }
.kari-sec {
  padding: 6px 8px; font: 500 14px var(--sans); color: var(--murekkep);
  border: 1px solid var(--cizgi); border-radius: 8px; background: var(--kagit);
  max-width: 220px;
}

.meal-secici {
  position: sticky; top: 58px; z-index: 40;
  display: flex; align-items: center; gap: 10px;
  background: var(--panel); border: 1px solid var(--cizgi); border-radius: 10px;
  padding: 9px 14px; margin-bottom: 24px;
  box-shadow: 0 6px 18px -12px rgba(33, 40, 34, .35);
}
.meal-secici label { font-weight: 700; font-size: 14px; letter-spacing: .5px;
  text-transform: uppercase; color: var(--soluk); }
.meal-secici select {
  flex: 1; max-width: 340px; padding: 7px 10px;
  font: 500 16px var(--sans); color: var(--murekkep);
  border: 1px solid var(--cizgi); border-radius: 8px; background: var(--kagit);
}

.besmele {
  font-family: var(--arapca); font-size: 30px; text-align: center;
  color: var(--zumrut); margin: 6px 0 22px;
}

.ayet-blok {
  background: var(--panel); border: 1px solid var(--cizgi);
  border-left: 3px solid var(--zumrut); border-radius: 10px;
  padding: 18px 22px; margin-bottom: 14px;
}
.ab-ust { float: left; margin: 2px 12px 6px 0; }
.ayet-no {
  display: grid; place-items: center; width: 34px; height: 34px;
  border-radius: 50%; background: var(--zumrut-tint); color: var(--zumrut);
  font-weight: 700; font-size: 14px;
}
.ayet-no:hover { background: var(--zumrut); color: #fff; }
.ab-ust { display: flex; flex-direction: column; gap: 6px; align-items: center; }
.ayet-dinle {
  width: 34px; height: 34px; border-radius: 50%; cursor: pointer;
  display: grid; place-items: center; padding: 0;
  font-size: 12px; line-height: 1; color: var(--bakir);
  background: rgba(164, 86, 47, .1); border: 1px solid transparent;
  transition: background .12s, color .12s;
}
.ayet-dinle:hover { background: var(--bakir); color: #fff; }
.ayet-blok.caliyor { border-left-color: var(--bakir);
  box-shadow: 0 0 0 1px var(--bakir) inset; }
.ayet-blok.caliyor .ayet-dinle { background: var(--bakir); color: #fff; }
.klm { transition: color .12s, background .12s; }
.klm.okunan {
  color: var(--bakir);
  background: rgba(164, 86, 47, .12);
  border-radius: 4px;
}
.arapca {
  font-family: var(--arapca); font-size: 27px; line-height: 2.1;
  text-align: right; clear: none; margin-bottom: 8px;
}
.okunus { font-style: italic; color: var(--soluk); margin-bottom: 8px; clear: left; }
.meal { font-size: 17.5px; }
.ab-alt { margin-top: 10px; font-size: 15px; display: flex; gap: 16px;
  flex-wrap: wrap; }
.ab-alt a { font-weight: 500; }
.tefsir-link { color: var(--bakir); }
.tefsir-link:hover { color: var(--zumrut); }

.sure-gezinti {
  display: flex; justify-content: space-between; gap: 12px;
  margin-top: 30px; font-weight: 500; flex-wrap: wrap;
}

/* ---------------- ayet sayfası ---------------- */
.ayet-baslik { text-align: center; margin-bottom: 22px; }

.ayet-panel {
  background: var(--panel); border: 1px solid var(--cizgi); border-radius: 16px;
  padding: 30px 34px; text-align: center; margin-bottom: 34px;
  box-shadow: 0 14px 34px -22px rgba(33, 40, 34, .4);
}
.arapca-buyuk {
  font-family: var(--arapca); font-size: clamp(28px, 4.4vw, 40px);
  line-height: 2.05; color: var(--murekkep); margin-bottom: 14px;
}
.okunus-buyuk { font-style: italic; color: var(--soluk); font-size: 18px; }

.mealler h2 { font-size: 26px; margin-bottom: 18px; }
.mealler h2 small { font-family: var(--sans); font-size: 15px;
  font-weight: 400; color: var(--soluk); margin-left: 8px; }

.meal-kart {
  background: var(--panel); border: 1px solid var(--cizgi);
  border-left: 3px solid var(--bakir); border-radius: 10px;
  padding: 16px 20px; margin-bottom: 12px;
}
.meal-kart h3 { font-size: 17px; color: var(--zumrut-koyu); display: inline; }
.meal-kart .eser { display: inline; color: var(--soluk); font-size: 14px;
  margin-left: 8px; font-style: italic; }
.mk-metin { margin-top: 8px; font-size: 17.5px; }
.rozet {
  display: inline-block; vertical-align: 2px; margin-left: 8px;
  font: 700 11px var(--sans); letter-spacing: 1px; text-transform: uppercase;
  color: var(--bakir); background: rgba(164, 86, 47, .1);
  border-radius: 20px; padding: 2px 9px;
}
.tefsirler { margin-top: 34px; overflow-anchor: none; }
.tefsirler h2 { font-size: 26px; margin-bottom: 14px; }
.tefsirler h2 small { font-family: var(--sans); font-size: 15px;
  font-weight: 400; color: var(--soluk); margin-left: 8px; }
.tefsir-sekmeler { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; }
.sekme {
  padding: 9px 16px; cursor: pointer;
  font: 700 15px var(--sans); color: var(--zumrut-koyu);
  background: var(--panel); border: 1.5px solid var(--cizgi);
  border-radius: 24px; transition: background .12s, border-color .12s;
}
.sekme:hover { border-color: var(--zumrut); }
.sekme.aktif { background: var(--zumrut); border-color: var(--zumrut);
  color: #fff; }
.tefsir-panel {
  position: relative;
  background: var(--panel); border: 1px solid var(--cizgi);
  border-left: 3px solid var(--zumrut); border-radius: 10px;
  padding: 16px 20px;
}
.tefsir-panel p { margin-bottom: 10px; font-size: 16.5px; color: #2A322C; }
.tefsir-panel .tp-kaynak { font-style: italic; color: var(--soluk);
  font-size: 14px; border-bottom: 1px dashed var(--cizgi);
  padding-bottom: 8px; }
.tefsir-panel.kisalt { max-height: 460px; overflow: hidden; }
.tefsir-panel.kisalt::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 110px;
  background: linear-gradient(180deg, transparent, var(--panel) 82%);
  border-radius: 0 0 10px 10px;
}
.devam-dugme {
  display: block; margin: 10px auto 0; padding: 9px 22px; cursor: pointer;
  font: 700 15px var(--sans); color: var(--zumrut);
  background: var(--zumrut-tint); border: 1.5px solid var(--zumrut);
  border-radius: 24px;
}
.devam-dugme:hover { background: var(--zumrut); color: #fff; }

.ayet-atla { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 12px; }
.ayet-atla a {
  padding: 6px 14px; font-size: 14px; font-weight: 700;
  background: var(--zumrut-tint); color: var(--zumrut-koyu);
  border-radius: 20px;
}
.ayet-atla a:hover { background: var(--zumrut); color: #fff; }

/* kelime çözümlemesi + kök + nüzul + benzer + arama */
.tekin-icerik { padding: 0 var(--tekin-bosluk) var(--tekin-bosluk); }
.tekin-meal { scroll-margin-top: var(--tekin-capa-boslugu); }
.tekin-aciklama, .tekin-kaynak { color: var(--soluk); margin: var(--tekin-bosluk) 0; }
.tekin-kaynak { font-size: .9em; }
.tekin-baslik { margin-top: var(--tekin-bosluk); }
.tekin-araclar { display: flex; flex-wrap: wrap; gap: var(--tekin-aralik);
  align-items: center; margin: var(--tekin-aralik) 0; }
.tekin-araclar a { display: inline-flex; align-items: center; min-height: 44px; text-decoration: underline; }
.tekin-araclar button { min-height: 44px; }
.tekin-sayfa { margin-top: var(--tekin-bosluk); min-width: 0; }
.tekin-sayfa figcaption { color: var(--zumrut-koyu); font-weight: 700; }
.tekin-gorsel { overflow: auto; max-width: 100%; background: var(--panel); }
.tekin-gorsel img { display: block; width: 100%; height: auto; }
.tekin-buyuk .tekin-gorsel img { width: var(--tekin-okuma-genisligi); max-width: none; }
.tekin-durum { color: var(--soluk); font-size: .9em; }
.tekin-meal summary::after { content: "+"; margin-left: auto; }
.tekin-meal[open] summary::after { content: "−"; }
.tekin-meal :focus-visible { outline: 2px solid var(--zumrut); outline-offset: 3px; }
.kelimeler { margin-top: 30px; background: var(--panel);
  border: 1px solid var(--cizgi); border-radius: 10px; }
.kelimeler summary { cursor: pointer; list-style: none; padding: 14px 20px;
  display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.kelimeler summary::-webkit-details-marker { display: none; }
.kelimeler summary b { font-family: var(--serif); font-size: 18px;
  color: var(--zumrut-koyu); }
.kelimeler summary small { color: var(--soluk); font-size: 13.5px;
  font-style: italic; }
.kelimeler summary:hover { background: var(--zumrut-tint); }
.kc-kaydir { overflow-x: auto; padding: 0 20px 16px; }
.kelimeler table { width: 100%; border-collapse: collapse; font-size: 15px; }
.kelimeler th { text-align: left; color: var(--soluk); font-size: 12.5px;
  text-transform: uppercase; letter-spacing: .5px;
  border-bottom: 1px solid var(--cizgi); padding: 6px 8px; }
.kelimeler td { padding: 7px 8px; border-bottom: 1px solid var(--kagit);
  vertical-align: top; }
.kc-ar { font-family: var(--arapca); font-size: 20px; white-space: nowrap; }
.kc-kok a { font-family: var(--arapca); font-size: 18px; color: var(--bakir); }
.kc-anlam { color: #3E463F; font-family: var(--arapca); font-size: 17px; }
.benzerler, .nuzool { margin-top: 30px; }
.benzerler h2, .nuzool h2 { font-size: 24px; margin-bottom: 14px; }
.benzerler h2 small, .nuzool h2 small { font-family: var(--sans);
  font-size: 14px; font-weight: 400; color: var(--soluk); margin-left: 8px; }
.nuzool-metin { background: var(--panel); border: 1px solid var(--cizgi);
  border-right: 3px solid var(--zumrut); border-radius: 10px;
  padding: 16px 20px; font-family: var(--arapca); font-size: 19px;
  line-height: 2; }
.ara-durum { color: var(--soluk); margin: 14px 0 18px; min-height: 1.4em; }

.sure-istatistik {
  display: flex; flex-wrap: wrap; gap: 8px; justify-content: center;
  margin-top: 16px;
}
.sure-istatistik div {
  background: var(--panel); border: 1px solid var(--cizgi); border-radius: 10px;
  padding: 8px 16px; min-width: 88px; text-align: center; line-height: 1.25;
}
.sure-istatistik b { display: block; font-family: var(--serif); font-size: 18px;
  color: var(--zumrut-koyu); }
.sure-istatistik .si-ar { font-family: var(--arapca); font-size: 20px; }
.sure-istatistik small { color: var(--soluk); font-size: 12px; }
.kc-detay {
  cursor: pointer; padding: 8px 18px; font: 700 14px var(--sans);
  color: var(--zumrut); background: var(--zumrut-tint);
  border: 1.5px solid var(--zumrut); border-radius: 20px;
}
.kc-detay:hover { background: var(--zumrut); color: #fff; }
.kc-detay-alan { padding: 0 20px 16px; }
.kelimeler .nuzool-metin { margin: 0 20px 16px; }
.ar-metin p { font-family: var(--arapca); font-size: 18px; line-height: 2;
  text-align: right; }
.tecvid-k .nuzool-metin, .faide .nuzool-metin { margin: 0 20px 16px;
  border-right-width: 1px; }

.dipnot { margin-top: 10px; border-top: 1px dashed var(--cizgi); padding-top: 8px; }
.dipnot summary {
  cursor: pointer; font-weight: 700; font-size: 14px; color: var(--bakir);
  letter-spacing: .3px;
}
.dipnot p { margin: 8px 0 0; color: #3E463F; font-size: 16px; }

/* ---------------- mealler + düz sayfalar ---------------- */
.sayfa-ozet { color: var(--soluk); max-width: 68ch; margin: 10px 0 26px; }
.yazar-izgara {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 12px;
}
.yazar-kart {
  background: var(--panel); border: 1px solid var(--cizgi);
  border-radius: 10px; padding: 16px 20px;
}
.yazar-kart h2 { font-size: 19px; color: var(--zumrut-koyu); }
.yazar-kart .eser { color: var(--soluk); font-style: italic; font-size: 15px; }

.duz-metin { max-width: 760px; }
.duz-metin h1 { margin-bottom: 16px; }
.duz-metin h2 { margin: 26px 0 10px; font-size: 23px; }
.duz-metin p, .duz-metin ul { margin-bottom: 12px; }
.duz-metin ul { padding-left: 22px; }
.ortala { text-align: center; padding-top: 80px; padding-bottom: 80px; }
.dugme {
  display: inline-block; background: var(--zumrut); color: #fff;
  padding: 11px 22px; border-radius: 10px; font-weight: 700;
}
.dugme:hover { background: var(--zumrut-koyu); color: #fff; }

/* ---------------- alt ---------------- */
.alt { border-top: 1px solid var(--cizgi); margin-top: 40px;
  background: #F1EEE5; }
.alt-ic { max-width: 1080px; margin: 0 auto; padding: 34px 20px;
  color: var(--soluk); font-size: 15px; }
.alt-marka { display: flex; align-items: center; gap: 8px;
  font-family: var(--serif); font-weight: 700; font-size: 20px;
  color: var(--murekkep); margin-bottom: 10px; }
.alt-marka .marka-simge { width: 26px; height: 26px; }
.alt-ic p { max-width: 72ch; margin-bottom: 8px; }
.alt-linkler { font-weight: 500; }
.telif { margin-top: 10px; font-size: 13.5px; }
.telif .yapimci { color: var(--soluk); font-weight: 700; }
.telif .yapimci:hover { color: var(--zumrut); }

/* ---------------- hızlı düğmeler ---------------- */
.hizli { margin-top: 18px; display: flex; gap: 10px; flex-wrap: wrap; }
.dugme.ikincil { background: transparent; color: var(--zumrut);
  border: 1.5px solid var(--zumrut); }
.dugme.ikincil:hover { background: var(--zumrut-tint); color: var(--zumrut-koyu); }

/* ---------------- fihrist ---------------- */
.harf-nav { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 26px; }
.harf-nav a {
  min-width: 34px; height: 34px; display: grid; place-items: center;
  background: var(--panel); border: 1px solid var(--cizgi); border-radius: 8px;
  font-weight: 700; color: var(--zumrut);
}
.harf-nav a:hover { background: var(--zumrut); color: #fff; }
.fihrist-bolum { margin-bottom: 26px; }
.fihrist-bolum h2 {
  font-size: 22px; color: var(--bakir); border-bottom: 1px solid var(--cizgi);
  padding-bottom: 6px; margin-bottom: 12px;
}
.fihrist-izgara {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 10px;
}
.fihrist-kart {
  background: var(--panel); border: 1px solid var(--cizgi); border-radius: 10px;
  padding: 12px 16px; color: var(--murekkep); line-height: 1.35;
  transition: transform .12s, border-color .12s;
}
.fihrist-kart:hover { transform: translateY(-2px); border-color: var(--zumrut);
  color: var(--murekkep); }
.fihrist-kart b { font-size: 16.5px; color: var(--zumrut-koyu); }
.fihrist-kart small { display: block; color: var(--soluk); font-size: 13.5px;
  margin-top: 2px; }
.fihrist-ayet {
  display: block; background: var(--panel); border: 1px solid var(--cizgi);
  border-left: 3px solid var(--zumrut); border-radius: 10px;
  padding: 14px 18px; margin-bottom: 10px; color: var(--murekkep);
}
.fihrist-ayet:hover { border-color: var(--zumrut); color: var(--murekkep); }
.fa-kaynak { display: block; font-weight: 700; color: var(--zumrut-koyu);
  font-size: 15px; margin-bottom: 4px; }
.fa-metin { display: block; }
.fa-devam { display: block; margin-top: 6px; font-size: 14px; color: var(--bakir); }

/* ---------------- kuran oku ---------------- */
.oku-hero {
  display: grid; grid-template-columns: 1.1fr .9fr; gap: 40px;
  align-items: center; margin-bottom: 40px;
}
.oku-hero h1 { font-size: clamp(30px, 4vw, 42px); margin-bottom: 10px; }
.oku-hero .sayfa-ozet { margin-bottom: 4px; }
.sayfa-git {
  display: flex; align-items: center; gap: 8px; margin-top: 16px;
  flex-wrap: wrap;
}
.sayfa-git label { font-weight: 700; font-size: 14px; letter-spacing: .5px;
  text-transform: uppercase; color: var(--soluk); }
.sayfa-git input {
  width: 110px; padding: 9px 12px; font: 500 16px var(--sans);
  border: 1.5px solid var(--cizgi); border-radius: 10px;
  background: var(--panel); color: var(--murekkep); outline: none;
}
.sayfa-git input:focus { border-color: var(--zumrut); }
.sayfa-git .dugme { border: 0; cursor: pointer; font: 700 16px var(--sans);
  padding: 10px 18px; }
.oku-istatistik {
  margin-top: 18px; font-family: var(--arapca); font-size: 19px;
  color: var(--bakir);
}
.mushaf-mini { display: block; max-width: 400px; justify-self: center;
  width: 100%; transition: transform .15s; }
.mushaf-mini:hover { transform: translateY(-4px) rotate(-.4deg); }
.mushaf-mini .mushaf-ic { min-height: 0; padding: 16px 16px 12px; }
.mushaf-mini .mushaf-metin { font-size: 19px; line-height: 2.2; }
.mushaf-mini .ayet-isaret { font-size: 16px; }

.cuz-izgara {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 10px; margin-bottom: 36px;
}
.cuz-kart {
  background: var(--panel); border: 1px solid var(--cizgi); border-radius: 10px;
  text-align: center; padding: 12px 6px 10px; color: var(--murekkep);
  transition: transform .12s, border-color .12s, box-shadow .12s;
  line-height: 1.35;
}
.cuz-kart:hover { transform: translateY(-2px); border-color: var(--zumrut);
  box-shadow: 0 8px 20px -12px rgba(15, 91, 71, .4); color: var(--murekkep); }
.cuz-kart b { display: block; font-family: var(--arapca); font-size: 26px;
  color: var(--zumrut); line-height: 1.2; }
.cuz-kart .ck-ad { display: block; font-weight: 700; font-size: 14px;
  color: var(--zumrut-koyu); }
.cuz-kart small { color: var(--soluk); font-size: 12px; }

@media (max-width: 880px) {
  .oku-hero { grid-template-columns: 1fr; gap: 26px; }
}

.oku-arac { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 18px; }
.oku-atla {
  flex: 1; min-width: 120px; padding: 8px 10px;
  font: 500 15px var(--sans); color: var(--murekkep);
  border: 1px solid var(--cizgi); border-radius: 8px; background: var(--panel);
}

.mushaf {
  max-width: 640px; margin: 0 auto;
  background: linear-gradient(180deg, #FFFEFA 0%, #FBF8F0 100%);
  border: 1px solid var(--bakir); border-radius: 6px;
  box-shadow:
    0 0 0 5px var(--panel),
    0 0 0 6px var(--cizgi),
    0 24px 50px -30px rgba(33, 40, 34, .5);
  padding: 10px;
}
.mushaf-ic {
  border: 1.5px solid var(--zumrut);
  outline: 1px solid var(--bakir); outline-offset: 3px;
  border-radius: 4px; padding: 26px 24px 18px; min-height: 60vh;
}
.mushaf-metin {
  font-family: var(--arapca); font-size: 25px; line-height: 2.35;
  text-align: justify; text-align-last: center; color: #1A211C;
}
.ayet-isaret { color: var(--bakir); font-size: 21px; }
.mushaf-sure-basi {
  display: flex; align-items: center; justify-content: space-between;
  border-top: 1px solid var(--bakir); border-bottom: 1px solid var(--bakir);
  padding: 6px 10px; margin: 14px 0 10px;
  background: var(--zumrut-tint); border-radius: 4px;
}
.msb-ad { font-family: var(--serif); font-weight: 700; font-size: 15px;
  color: var(--zumrut-koyu); }
.msb-ar { font-family: var(--arapca); font-size: 22px; color: var(--zumrut); }
.mushaf-besmele {
  font-family: var(--arapca); font-size: 24px; text-align: center;
  color: var(--zumrut); margin: 4px 0 10px;
}
.mushaf-alt {
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 14px 2px; color: var(--soluk); font-size: 13.5px;
}
.mushaf-no {
  font-family: var(--arapca); font-size: 21px; color: var(--bakir);
}
.oku-gezinti {
  max-width: 640px; margin: 18px auto; display: flex;
  justify-content: space-between; align-items: center; gap: 10px;
  font-weight: 700;
}
.oku-gez { font-size: 18px; }
.oku-mealler { max-width: 760px; margin: 30px auto 0; }
.oku-meal-satir {
  background: var(--panel); border: 1px solid var(--cizgi);
  border-radius: 8px; padding: 10px 14px; margin-bottom: 8px;
}
.oku-no { font-weight: 700; font-size: 14px; margin-right: 6px;
  white-space: nowrap; }

/* ---------------- dil değiştirici ---------------- */
.dil { position: relative; }
.dil summary {
  cursor: pointer; list-style: none; font-weight: 500;
  padding: 4px 10px; border: 1px solid var(--cizgi); border-radius: 8px;
  background: var(--panel);
}
.dil summary::-webkit-details-marker { display: none; }
.dil summary::after { content: " ▾"; font-size: 11px; color: var(--soluk); }
.dil[open] summary { border-color: var(--zumrut); }
.dil nav {
  position: absolute; top: calc(100% + 6px); inset-inline-end: 0; z-index: 60;
  min-width: 170px; display: flex; flex-direction: column;
  background: var(--panel); border: 1px solid var(--cizgi); border-radius: 10px;
  box-shadow: 0 14px 34px -18px rgba(33, 40, 34, .5); overflow: hidden;
}
.dil nav a { padding: 8px 14px; color: var(--murekkep); }
.dil nav a:hover { background: var(--zumrut-tint); color: var(--zumrut); }
.dil nav a.aktif { font-weight: 700; color: var(--zumrut); }

/* ---------------- dil bazlı tipografi ---------------- */
/* Rusça: Fraunces/Alegreya Kiril desteklemiyor */
.lang-ru body, .lang-ru { --serif: "Playfair Display", Georgia, serif;
  --sans: "PT Sans", "Segoe UI", sans-serif; }
/* Urduca: nestalik */
.lang-ur body, .lang-ur { --sans: "Noto Nastaliq Urdu", serif; }
.lang-ur body { font-size: 16px; line-height: 2.1; }
.lang-ur h1, .lang-ur h2, .lang-ur h3 { font-family: "Noto Nastaliq Urdu", serif;
  line-height: 1.9; }
.lang-ur .marka-ad { font-family: "Fraunces", Georgia, serif; }

/* ---------------- RTL (Urduca) ---------------- */
[dir="rtl"] .ayet-blok { border-left: 1px solid var(--cizgi);
  border-right: 3px solid var(--zumrut); }
[dir="rtl"] .meal-kart { border-left: 1px solid var(--cizgi);
  border-right: 3px solid var(--bakir); }
[dir="rtl"] .ab-ust { float: right; margin: 2px 0 6px 12px; }
[dir="rtl"] .ayet-blok.caliyor { border-right-color: var(--bakir); }
[dir="rtl"] .okunus { clear: right; }
[dir="rtl"] .meal-kart .eser { margin-left: 0; margin-right: 8px; }
[dir="rtl"] .rozet { margin-left: 0; margin-right: 8px; }
[dir="rtl"] .bolum-baslik small { margin-left: 0; margin-right: 10px; }
[dir="rtl"] .duz-metin ul { padding-left: 0; padding-right: 22px; }

/* ---------------- duyarlı ---------------- */
@media (max-width: 880px) {
  /* --- üst menü: hamburger + açılır panel --- */
  .menu-dugme { display: flex; }
  .ust-ic { padding: 8px 16px; }
  .marka-ad { font-size: 21px; }
  .marka-simge { width: 30px; height: 30px; }
  .ust-linkler {
    display: none;
    position: absolute; top: 100%; left: 0; right: 0;
    flex-direction: column; align-items: stretch; gap: 0;
    background: var(--panel); border-bottom: 1px solid var(--cizgi);
    box-shadow: 0 18px 30px -18px rgba(33, 40, 34, .35);
    padding: 6px 0;
  }
  .menu-acik .ust-linkler { display: flex; }
  .ust { position: sticky; }
  .ust-ic { position: relative; }
  .menu-acik .ust-ic { position: static; }
  .ust-linkler a {
    padding: 13px 20px; font-size: 17px;
    border-bottom: 1px solid var(--kagit);
  }
  .ust-linkler a:active { background: var(--zumrut-tint); }
  .dil { padding: 10px 20px 12px; }
  .dil summary { display: inline-block; }
  .dil nav { position: static; margin-top: 8px; box-shadow: none; }

  /* --- genel okunabilirlik --- */
  .govde { padding: 26px 16px; }
  .kapak-ic { grid-template-columns: 1fr; gap: 28px; padding: 34px 16px 32px; }
  .kapak h1 { letter-spacing: -.5px; }
  .kapak-alt { font-size: 17px; }
  .uc-sutun { grid-template-columns: 1fr; gap: 20px; }
  .bolum-baslik { font-size: 24px; }
  .bolum-baslik small { display: block; margin: 4px 0 0; }
  .kirinti { font-size: 13.5px; overflow-x: auto; white-space: nowrap;
    -webkit-overflow-scrolling: touch; }
  .gunun-ayeti { padding: 20px; border-radius: 12px; }
  .ga-arapca { font-size: 23px; line-height: 1.95; }

  /* --- sure & ayet sayfaları --- */
  .arapca { font-size: 23px; line-height: 2.15; }
  .arapca-buyuk { line-height: 2.1; }
  .okunus, .okunus-buyuk { font-size: 15.5px; }
  .meal, .mk-metin { font-size: 16.5px; }
  .ayet-panel { padding: 20px 14px; border-radius: 12px; }
  .ayet-blok { padding: 14px 14px; }
  .meal-kart { padding: 13px 14px; }
  .sb-ar { font-size: 36px; }
  .meal-secici { top: 50px; padding: 8px 10px; }
  .meal-secici select { font-size: 15px; }
  .ses-cubugu { gap: 8px; }
  .ses-blok { width: 100%; justify-content: space-between; padding: 8px 10px; }
  .ses-blok audio { flex: 1; max-width: none; min-width: 0; }
  .kari-sec { max-width: none; width: 100%; }
  .sure-gezinti { font-size: 15px; }

  /* --- kuran oku --- */
  .oku-arac { flex-direction: column; }
  .oku-atla { width: 100%; }
  .mushaf { padding: 6px; }
  .mushaf-ic { padding: 16px 12px 12px; }
  .mushaf-metin { font-size: 21px; line-height: 2.25; }
  .ayet-isaret { font-size: 17px; }
  .mushaf-besmele { font-size: 21px; }
  .oku-meal-satir { padding: 9px 12px; font-size: 16px; }

  /* --- fihrist --- */
  .fihrist-izgara { grid-template-columns: 1fr; }
  .harf-nav a { min-width: 38px; height: 38px; }
  .fihrist-ayet { padding: 12px 14px; }
}

.has-radio-dock{padding-bottom:100px!important}.has-radio-dock .player{bottom:80px!important}.reader-radio-link{font-size:14px;color:var(--green)}

.ky-library{max-width:1100px;margin:auto;padding:44px 24px 64px}.ky-library h1{font-size:44px;font-weight:400;margin:10px 0}.ky-eyebrow{font-size:12px;letter-spacing:2px;color:var(--zumrut)}.ky-subtitle{font-size:19px;color:var(--soluk)}.ky-about{max-width:780px;margin:32px 0;padding:24px 0;border-top:1px solid var(--cizgi);border-bottom:1px solid var(--cizgi)}.ky-about h2{font-size:24px;font-weight:400}.ky-about p{margin:12px 0;color:var(--soluk)}.ky-about .dugme{margin-top:8px}.ky-library>h2{font-size:25px;margin-bottom:18px}.ky-library>label{display:block;color:var(--soluk);font-size:14px}.ky-library>input{font:inherit;padding:10px 14px;background:var(--panel);border:1px solid var(--cizgi);border-radius:5px;max-width:100%;width:360px;margin:8px 0 24px}.ky-library .sure-izgara{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.ky-library .sure-kart{display:flex;align-items:center;gap:16px;padding:16px}.ky-library .sure-kart small{display:block;font-size:13px;color:var(--soluk)}.ky-source{font-size:13px;color:var(--soluk);margin-top:30px}.ky-library :focus-visible{outline:3px solid var(--bakir);outline-offset:3px}@media(max-width:800px){.ky-library{padding:28px 20px}.ky-library h1{font-size:34px}.ky-library .sure-izgara{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:500px){.ky-library .sure-izgara{grid-template-columns:1fr}}
.ky-book{max-width:820px;margin:0 auto;padding:36px 24px 80px}.ky-book h1{font-size:clamp(28px,4vw,42px);line-height:1.2;font-weight:400}.ky-book p,.ky-content p,.ky-dialog p{font-size:18px;line-height:1.85;overflow-wrap:anywhere;margin:1em 0}.ky-block{padding:24px 0;scroll-margin-top:90px;border-bottom:1px solid var(--cizgi,var(--line,#ddd))}.ky-block h2,.ky-block h3{line-height:1.4;margin:16px 0}.ky-ar{font-family:var(--arabic,'Scheherazade New',serif);font-size:28px!important;line-height:2!important}.ky-pagination{display:flex;justify-content:space-between;flex-wrap:wrap;gap:16px;margin:28px 0}.ky-notice{border-left:3px solid var(--bakir,var(--gold,#947044));padding:12px 18px;background:var(--panel,var(--tint,#f4f3ec));line-height:1.65}.ky-shared,.ky-dialog .tp-kaynak{font-size:14px!important;color:var(--soluk,var(--muted,#68746b))}.ky-block details{margin:16px 0}.ky-block summary{cursor:pointer;font-weight:600;padding:8px 0}.ky-dialog{width:min(800px,calc(100% - 24px));max-height:85dvh;padding:24px 32px;border:1px solid var(--line,#ddd);border-radius:8px;color:var(--ink,#26392f);background:var(--sheet,#fffefa)}.ky-dialog::backdrop{background:#12251cb3}.ky-dialog>header{display:flex;align-items:center;justify-content:space-between;gap:16px}.ky-dialog h2{font-size:25px;margin:0}.ky-dialog a{color:var(--green,#145a43);text-decoration:underline}.ky-dialog button{padding:10px;white-space:nowrap}.reading-note{flex-wrap:wrap;gap:12px}.reading-note label{white-space:nowrap}.reading-bottom #kuranYoluLink{font:inherit;color:var(--green);text-decoration:underline}.ky-library section{margin:32px 0}@media(max-width:600px){.ky-book{padding:24px 20px 60px}.ky-dialog{padding:20px}.ky-dialog p,.ky-book p{font-size:17px}.ky-dialog h2{font-size:21px}}