/* ZARİF YAŞAM — Ekim 2026 · Sayı 03 */
:root{
  --lacivert:#14213d; --lacivert-2:#1f2f52; --altin:#a8823a; --altin-acik:#c9a24a;
  --krem:#f6f1e7; --krem-2:#fdfaf3; --murekkep:#2a2622; --gri:#6b6258; --cizgi:#e2d6bd;
  --serif:"EB Garamond",Garamond,Georgia,serif; --baslik:"Playfair Display",Georgia,serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;overflow-x:clip;background:var(--krem);color:var(--murekkep);font-family:var(--serif);font-size:20px;line-height:1.7}
img{max-width:100%;height:auto;display:block}
a{color:var(--altin)}

/* üst şerit */
.ust{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  padding:12px 24px;background:rgba(246,241,231,.94);backdrop-filter:blur(6px);border-bottom:1px solid var(--cizgi)}
.ust .logo{font-family:var(--baslik);font-weight:700;letter-spacing:.14em;color:var(--lacivert);text-decoration:none;font-size:19px}
.ust .sayi{color:var(--altin);font-size:15px;letter-spacing:.08em;text-transform:uppercase}
.ust .ic{margin-left:auto;color:var(--lacivert);text-decoration:none;font-size:16px;letter-spacing:.06em}
.diller{display:flex;gap:6px;align-items:center;font-size:14px;letter-spacing:.08em}
.diller a,.diller span{color:var(--gri);text-decoration:none}
.diller .on{color:var(--lacivert);font-weight:600}
.diller i{color:var(--cizgi);font-style:normal}

/* bölüm sayfası */
main{display:block}
.hero{max-width:1200px;margin:0 auto;padding:28px 24px 0}
.hero img{width:100%;border-radius:4px;box-shadow:0 18px 40px -24px rgba(20,33,61,.45)}
.metin{max-width:760px;margin:0 auto;padding:40px 24px 24px}
.kicker{font-family:var(--serif);color:var(--altin);letter-spacing:.22em;text-transform:uppercase;font-size:15px;font-weight:600;margin:0 0 10px;text-align:center}
h1{font-family:var(--baslik);color:var(--lacivert);font-weight:600;font-size:clamp(34px,6vw,58px);line-height:1.12;margin:0 0 18px;text-align:center;text-wrap:balance}
.deck{font-style:italic;color:var(--gri);font-size:23px;line-height:1.55;text-align:center;margin:0 auto 22px;max-width:640px;text-wrap:balance}
h2{font-family:var(--baslik);color:var(--lacivert);font-weight:600;font-size:clamp(25px,3.6vw,33px);line-height:1.25;margin:2.2em 0 .6em;text-wrap:balance}
h2::before{content:"";display:block;width:44px;height:2px;background:var(--altin-acik);margin-bottom:16px}
h3{font-family:var(--baslik);color:var(--lacivert-2);font-weight:500;font-size:clamp(20px,2.6vw,24px);line-height:1.3;margin:1.7em 0 .4em}
.metin p{margin:0 0 1em}
.metin p.li{padding-left:1.1em;text-indent:-1.1em;margin:0 0 .45em}
.alinti{font-family:var(--baslik);font-style:italic;color:var(--lacivert);font-size:clamp(23px,3.2vw,29px);line-height:1.45;text-align:center;
  margin:1.6em auto !important;padding:.9em 0;border-top:1px solid var(--cizgi);border-bottom:1px solid var(--cizgi);max-width:640px}
hr.sus{border:0;height:24px;margin:2em 0;background:
  linear-gradient(var(--cizgi),var(--cizgi)) left 50%/42% 1px no-repeat,
  linear-gradient(var(--cizgi),var(--cizgi)) right 50%/42% 1px no-repeat}
hr.sus::after{content:"◆";display:block;text-align:center;color:var(--altin-acik);font-size:11px;line-height:24px}
.bolum-ayrac{text-align:center;color:var(--altin);font-size:34px;margin:2.4em 0 1.2em}

/* görseller: metin sütunundan biraz taşar */
.fig,.pano{margin:1.6em -60px 1.8em}
.fig img,.pano img{width:100%;border-radius:3px}
.fig.row{display:grid;gap:12px}
.row2{grid-template-columns:1fr 1fr}
.row3{grid-template-columns:1fr 1fr 1fr}
.pano{margin-left:-40px;margin-right:-40px}
.pano img{box-shadow:0 14px 34px -22px rgba(20,33,61,.5)}
.cozum{margin:-.6em 0 2em;text-align:center}
.cozum summary{display:inline-block;cursor:pointer;list-style:none;padding:10px 22px;border:1px solid var(--altin);color:var(--altin);
  letter-spacing:.12em;text-transform:uppercase;font-size:14px;border-radius:999px}
.cozum summary::-webkit-details-marker{display:none}

/* kutu, imza, tablo */
.kutu{background:var(--krem-2);border:1px solid var(--cizgi);border-left:3px solid var(--altin-acik);padding:22px 28px 10px;margin:2.2em 0;border-radius:3px}
.kutu h2{margin-top:.2em;font-size:clamp(22px,3vw,27px)}
.kutu h2::before{display:none}
.imza{text-align:right;font-style:italic;margin-top:2em}
.imza p{margin:0 !important}
.tablo{overflow-x:auto;margin:1.2em 0 1.6em}
.tablo table{border-collapse:collapse;width:100%;font-size:17px}
.tablo th,.tablo td{border-bottom:1px solid var(--cizgi);padding:9px 10px;text-align:left;vertical-align:top}
.tablo th{color:var(--lacivert);font-weight:600;border-bottom:2px solid var(--altin-acik)}
.eposta a{font-size:1.15em}

/* bölümler arası akış */
.akis{max-width:960px;margin:30px auto 0;padding:26px 24px;display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:center;border-top:1px solid var(--cizgi)}
.akis a{text-decoration:none;color:var(--lacivert);font-family:var(--baslik);font-size:19px;line-height:1.3}
.akis small{display:block;font-family:var(--serif);color:var(--altin);font-size:13px;letter-spacing:.14em;text-transform:uppercase}
.akis .sonraki{text-align:right}
.akis .orta{font-family:var(--serif);font-size:15px;letter-spacing:.14em;text-transform:uppercase;border:1px solid var(--cizgi);padding:9px 16px;border-radius:999px}

.alt{background:var(--lacivert);color:#e9e1cf;text-align:center;padding:36px 20px 40px;margin-top:40px;font-size:15px;letter-spacing:.06em}
.alt p{margin:.25em 0}
.alt .m{font-family:var(--baslik);letter-spacing:.2em;color:var(--altin-acik);font-size:18px}
.alt a{color:var(--altin-acik)}

/* İçindekiler */
.ic-bas{text-align:center;padding:48px 24px 10px}
.kartlar{max-width:1100px;margin:0 auto;padding:20px 24px 10px;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.kart{display:flex;flex-direction:column;gap:6px;padding:22px 24px 24px;background:var(--krem-2);border:1.5px solid var(--cizgi);border-radius:8px;text-decoration:none;
  transition:transform .2s,box-shadow .2s,border-color .2s}
.kart:hover{transform:translateY(-2px);border-color:var(--altin-acik);box-shadow:0 12px 26px -18px rgba(20,33,61,.5)}
.kart .no{font-family:var(--baslik);color:var(--altin);font-size:24px}
.kart .kat{font-family:var(--baslik);color:var(--lacivert);font-weight:600;font-size:24px;line-height:1.2}
.kart .bas{font-style:italic;color:var(--gri);font-size:18px;line-height:1.4}
.geri{text-align:center;margin:26px 0 0}
.geri a{text-decoration:none;letter-spacing:.1em}

/* Kapak */
body.kapak{background:#1a1712;min-height:100vh}
.kapak-sahne{display:flex;flex-direction:column;align-items:center;padding:0}
.kapak-kutu{position:relative;width:min(100vw, calc(100svh * 1024 / 1536));max-width:1024px;margin:0 auto}
.kapak-kutu img{width:100%;height:100%;object-fit:contain}
.spot{position:absolute;display:block;border-radius:6px;outline:none;transition:box-shadow .25s,background .25s}
.spot:hover,.spot:focus-visible{background:rgba(255,236,190,.12);box-shadow:0 0 0 2px rgba(201,162,74,.85),0 0 26px rgba(255,220,150,.45)}
.kapak-alt{display:flex;gap:20px;align-items:center;justify-content:center;padding:14px;font-size:15px;letter-spacing:.1em}
.kapak-alt a{color:#e9d9b0;text-decoration:none;text-transform:uppercase}
.kapak-alt .diller span,.kapak-alt .diller a{color:#bfb39a}
.kapak-alt .diller .on{color:#f1e3bd}

@media (max-width:820px){
  body{font-size:18.5px}
  .fig,.pano{margin-left:-20px;margin-right:-20px}
  .fig img,.pano img{border-radius:0}
  .row3{grid-template-columns:1fr}
  .hero{padding:0}
  .hero img{border-radius:0}
  .ust{padding:10px 16px;gap:10px}
  .ust .sayi{display:none}
  .metin{padding:30px 20px 18px}
  .akis{grid-template-columns:1fr 1fr}
  .akis .orta{grid-column:1/-1;order:-1;justify-self:center}
}
@media (max-width:480px){
  .row2{gap:6px}
  .kutu{padding:18px 18px 6px}
}

/* ---- RTL (Arapça) ---- */
[dir=rtl] body{font-family:'Amiri','EB Garamond',serif;line-height:1.95;font-size:22px}
[dir=rtl] *{letter-spacing:0 !important}
[dir=rtl] .kicker,[dir=rtl] .akis small,[dir=rtl] .akis .orta{text-transform:none}
[dir=rtl] h1,[dir=rtl] h2,[dir=rtl] h3,[dir=rtl] .alinti,[dir=rtl] .kart .no,[dir=rtl] .kart .kat,[dir=rtl] .ust .logo,[dir=rtl] .akis a{font-family:'Amiri',serif}
[dir=rtl] .deck,[dir=rtl] .alinti,[dir=rtl] .kart .bas{font-style:normal}
[dir=rtl] .ust .logo{font-family:var(--baslik);letter-spacing:.14em !important}
[dir=rtl] .ust .ic{margin-left:0;margin-right:auto}
[dir=rtl] .diller{direction:ltr}
[dir=rtl] .kapak-kutu,[dir=rtl] .kapak-alt{direction:ltr}
[dir=rtl] .metin p.li{padding-left:0;padding-right:1.1em;text-indent:0}
[dir=rtl] .kutu{border-left:1px solid var(--cizgi);border-right:3px solid var(--altin-acik)}
[dir=rtl] .imza{text-align:left;font-style:normal}
[dir=rtl] .tablo th,[dir=rtl] .tablo td{text-align:right}
[dir=rtl] .alt .m{letter-spacing:.2em !important}

/* ---- Kapak dil menüsü ---- */
button.spot{background:none;border:0;padding:0;cursor:pointer}
.dilmenu{position:absolute;z-index:20;display:flex;gap:2px;background:rgba(18,24,48,.94);border:1px solid rgba(201,162,74,.85);border-radius:10px;padding:6px 8px;box-shadow:0 6px 24px rgba(0,0,0,.35);direction:ltr}
.dilmenu[hidden]{display:none}
.dilmenu a{color:#e9dcc0;text-decoration:none;font:600 clamp(12px,3.4vw,15px)/1 'EB Garamond',Georgia,serif;letter-spacing:.08em;padding:9px 9px;border-radius:6px}
.dilmenu a:hover,.dilmenu a:focus-visible{background:rgba(201,162,74,.25);outline:none}
.dilmenu a.on{color:#f1c96a}

/* ---- Etkileşimli bulmaca ---- */
.cw{margin:28px 0}.cw-t{text-align:center}
.cw-banner{position:sticky;top:0;z-index:5;background:var(--krem,#faf5ec);border:1px solid var(--cizgi,#d9cdb2);border-radius:8px;padding:10px 14px;margin:10px 0;font-size:16px;line-height:1.4;text-align:center;color:var(--lacivert,#141c3a)}
.cw-scroll{overflow-x:auto;padding:6px 0;text-align:center}
.cw-grid{display:inline-grid;direction:ltr;gap:0;margin:0 auto;text-align:start}
[dir=rtl] .cw-grid{direction:rtl}
.cw-b{width:var(--cs);height:var(--cs)}
.cw-c{position:relative;width:var(--cs);height:var(--cs);background:#fff;border:1.5px solid #141c3a;margin:0 -1px -1px 0;box-sizing:border-box}
[dir=rtl] .cw-c{margin:0 0 -1px -1px}
.cw-c span{position:absolute;top:1px;left:2px;font:600 9px/1 'EB Garamond',serif;color:#b08d4a;pointer-events:none;z-index:2}
[dir=rtl] .cw-c span{left:auto;right:2px}
.cw-c input{position:absolute;inset:0;width:100%;height:100%;border:0;background:transparent;text-align:center;font:600 calc(var(--cs)*.56)/1 'EB Garamond',serif;color:#141c3a;text-transform:uppercase;padding:2px 0 0;caret-color:transparent;outline:none;cursor:pointer;border-radius:0;-webkit-appearance:none}
.cw-c.hl{background:#f6ecd0}.cw-c.cur{background:#e9c978}
.cw-c.bad{background:#f5c9c4}.cw-c.bad input{color:#a3201a}.cw-c.rev input{color:#8a6b22}
.cw-btns{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:14px 0 6px}
.cw-btns button{font:600 15px 'EB Garamond',serif;letter-spacing:.04em;color:#141c3a;background:#fff;border:1px solid #b08d4a;border-radius:20px;padding:9px 16px;cursor:pointer}
.cw-btns button:hover{background:#f6ecd0}
#cw-msg{text-align:center;min-height:1.4em;font-weight:600}#cw-msg.ok{color:#2c6b3a}#cw-msg.bad{color:#a3201a}
.cw-clues{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:18px}
@media(max-width:640px){.cw-clues{grid-template-columns:1fr}}
.cw-clues h3{margin:0 0 8px;color:#b08d4a;letter-spacing:.08em;text-transform:uppercase;font-size:16px}
.cw-clues ol{list-style:none;margin:0;padding:0}
.cw-clues li{cursor:pointer;padding:6px 8px;border-radius:6px;line-height:1.4;font-size:16px}
.cw-clues li b{color:#b08d4a;font-weight:600}.cw-clues li i{font-style:normal;color:#777}
.cw-clues li:hover{background:#f6ecd0}.cw-clues li.on{background:#e9c978}
.cw-print{margin-top:22px}

/* ---- Etkileşimli test ---- */
.qz-leg{list-style:none;margin:14px 0;padding:14px 16px;background:var(--krem-2);border:1px solid var(--cizgi);border-radius:10px}
.qz-leg li{margin:4px 0}.qz-leg b{color:var(--altin);display:inline-block;width:1.4em}
.qz-h{margin:26px 0 8px}
.qz-i{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--cizgi)}
.qz-n{color:var(--altin);font-weight:600;min-width:1.8em}
.qz-t{flex:1;line-height:1.4}
.qz-o{display:flex;gap:6px;flex:none;direction:ltr}
.qz-o label{cursor:pointer;position:relative}
.qz-o input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.qz-o b{display:flex;align-items:center;justify-content:center;width:38px;height:38px;border:1.5px solid var(--altin);border-radius:50%;color:var(--lacivert);font-weight:600;background:#fff}
.qz-o input:checked+b{background:var(--lacivert);color:#f1e3bd;border-color:var(--lacivert)}
.qz-o input:focus-visible+b{outline:2px solid var(--altin-acik);outline-offset:2px}
@media(max-width:560px){.qz-i{flex-wrap:wrap}.qz-t{flex-basis:calc(100% - 3em)}.qz-o{margin-left:2.8em;gap:10px}[dir=rtl] .qz-o{margin-left:0;margin-right:2.8em}}
.qz-btns{display:flex;gap:10px;justify-content:center;margin:22px 0 8px}
.qz-btns button{font:600 16px var(--serif);color:var(--lacivert);background:#fff;border:1px solid var(--altin);border-radius:22px;padding:11px 22px;cursor:pointer}
#qz-calc{background:var(--lacivert);color:#f1e3bd;border-color:var(--lacivert)}
#qz-msg{text-align:center;font-weight:600;min-height:1.4em}
.qz-res{margin:16px 0;padding:6px 20px 14px;background:var(--krem-2);border:1px solid var(--altin-acik);border-radius:12px}
.qz-res[hidden]{display:none}