/* essay.css — On Life & Everything — Ortak Essay Stilleri */

@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;1,400;1,500&display=swap');
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

:root{
    --bg:#FAF8F4;
    --bg-warm:#F5F3ED;
    --bg-deep:#EDEBE1;
    --petrol:#206060;
    --charcoal:#302E2B;
    --vizon:#8A8279;
    --border:#E8E2D9;
    --cream:#FDFCFA;
    --shadow:rgba(32,96,96,0.04);
    --corridor-line:rgba(32,96,96,0.08);
    --corridor-line-active:rgba(32,96,96,0.18);
}

html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}
body{font-family:'Lora',Georgia,serif;background-color:var(--bg);color:var(--charcoal);line-height:1.85;font-size:18px;overflow-x:hidden;position:relative}
::selection{background:var(--petrol);color:var(--cream)}
a{color:var(--petrol);text-decoration:none;border-bottom:1px solid var(--border);transition:border-color .2s ease,color .2s ease}
a:hover{border-color:var(--petrol)}

/* Koridor Çizgileri */
.corridor-vline{position:fixed;top:0;height:100%;width:1px;pointer-events:none;z-index:0;background-color:var(--charcoal);opacity:0.06}
.corridor-vline--left{left:calc((100vw - 680px)/2 - 12px)}
.corridor-vline--right{right:calc((100vw - 680px)/2 - 12px)}
@media(max-width:1050px){.corridor-vline{display:none}}

.mobile-corridor{display:none}
@media(max-width:1050px){
    .mobile-corridor{display:block;position:fixed;top:0;height:100%;width:2px;pointer-events:none;z-index:0;background:linear-gradient(to bottom,transparent 0%,var(--corridor-line) 15%,var(--corridor-line-active) 50%,var(--corridor-line) 85%,transparent 100%)}
    .mobile-corridor--left{left:8px}
    .mobile-corridor--right{right:8px}
}

/* Container */
.container{max-width:680px;margin:0 auto;padding:0 28px;position:relative;z-index:1}

/* Sticky Header */
header{
    position:sticky;top:0;z-index:100;
    background:transparent;
    transition:background .4s ease,backdrop-filter .4s ease,border-bottom-color .4s ease;
    padding-top:20px;
    margin-left:-28px;margin-right:-28px;
    padding-left:28px;padding-right:28px;
    border-bottom:1px solid transparent;
}
header.scrolled{
    background:rgba(250,248,244,0.92);
    backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
    border-bottom-color:var(--border);
}
nav{display:flex;align-items:center;justify-content:space-between;padding-bottom:14px}
.nav-home{display:flex;align-items:center;gap:6px;border:none;font-style:italic;color:var(--vizon);font-size:15px}
.nav-home img{width:36px;height:36px;border-radius:8px;object-fit:contain;border:1px solid var(--border);background:var(--cream)}
.nav-home:hover{color:var(--petrol)}

.nav-right{display:flex;align-items:center;gap:12px}

/* Geri Dönüş Linki (Petrol) */
.nav-back{font-size:14px;color:var(--petrol);border:1px solid var(--border);padding:4px 14px;border-radius:4px;letter-spacing:.03em; transition: all .2s ease;}
.nav-back:hover{background:var(--bg-deep);border-color:var(--petrol)}

/* İkonlar Füme, Hover Petrol */
.essay-share-btn{background:transparent;border:none;color:var(--petrol);padding:4px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:opacity .2s ease, color .2s ease}
.essay-share-btn svg{width:20px;height:20px}
.essay-share-btn:hover{opacity:.8}

/* Logo Lockup */
.tagline-on{color:var(--vizon);font-size:24px;font-style:italic;line-height:1}
.tagline-stack{display:flex;flex-direction:column;gap:0;padding-top:2px}
.tagline-green{color:var(--petrol);font-size:9px;font-style:italic;letter-spacing:.04em;line-height:1.2}

/* Essay Header */
.essay-header{padding:48px 0 32px}
.essay-header h1{font-size:32px;font-weight:500;line-height:1.25;color:var(--petrol);margin-bottom:12px} /* Vurgu (Petrol) */
.essay-subtitle{font-size:17px;color:var(--vizon);font-style:italic;margin-bottom:20px} /* Detay (Vizon) */
.essay-meta-info{font-size:14px;color:var(--vizon);display:flex;align-items:center;gap:8px;flex-wrap:wrap} /* Detay (Vizon) */

/* Cover */
.essay-cover{width:100%;border-radius:6px;margin:32px 0 40px;overflow:hidden}
.essay-cover img{width:100%;display:block}

/* Essay Body */
.essay-body{padding-bottom:48px}
.essay-body p{margin-bottom:24px;color:var(--charcoal)} /* Omurga (Füme) */
.essay-body p:last-child{margin-bottom:0}
.essay-body h2{font-size:22px;font-weight:500;color:var(--petrol);margin:40px 0 16px;padding-top:20px;border-top:1px solid var(--border)} /* Vurgu (Petrol) */
.essay-body h3{font-size:19px;font-weight:500;color:var(--petrol);margin:32px 0 12px} /* Vurgu (Petrol) */
.essay-body blockquote{border-left:2px solid var(--petrol);padding:12px 0 12px 20px;margin:28px 0;font-style:italic;color:var(--vizon);font-size:19px}
.essay-body em{font-style:italic}
.essay-body strong,.essay-body b{font-weight:500}
.essay-body hr{border:none;height:1px;background:var(--border);margin:36px 0}
.essay-body img{max-width:100%;border-radius:4px;margin:24px 0}
.essay-body ul,.essay-body ol{margin:0 0 24px 24px;color:var(--charcoal)}
.essay-body li{margin-bottom:8px}

/* Navigasyon (Oklar Vizon, Başlıklar Petrol) */
.essay-nav{display:flex;justify-content:space-between;padding:32px 0;border-top:1px solid var(--border);gap:20px}
.essay-nav a{font-size:15px;color:var(--petrol);border:none;display:flex;flex-direction:column;gap:2px;max-width:45%;transition:opacity .2s ease}
.essay-nav a:hover{opacity: 0.8;}
.essay-nav .nav-label{font-size:12px;color:var(--vizon);text-transform:uppercase;letter-spacing:.08em}
.essay-nav .nav-title{font-style:italic; color:var(--petrol);}
.essay-nav .next{text-align:right;margin-left:auto}

/* Series Nav (Link Kutuları Petrol) */
.series-nav{margin-top:36px;padding:24px;border:1px solid var(--border);border-radius:8px;background:var(--cream)}
.series-nav-title{font-size:14px;color:var(--petrol);text-transform:uppercase;letter-spacing:.08em;margin-bottom:12px}
.series-nav-list{list-style:none;display:flex;flex-direction:column;gap:6px}
.series-nav-list a{font-size:15px;color:var(--petrol);border:none;font-style:italic; transition: opacity .2s ease;}
.series-nav-list a:hover{opacity: 0.8;}
.series-nav-list .current{color:var(--petrol);font-weight:500; font-style:italic;}

/* Footer - Font Bütünlüğü Sağlandı */
footer {
    margin-top: 60px;
    padding: 40px 0;
    border-top: 1px solid var(--border);
    text-align: center;
    font-family: 'Lora', Georgia, serif !important; /* Font burada kilitlendi */
}

footer p, footer a {
    font-size: 13px;
    color: var(--vizon);
    font-family: 'Lora', Georgia, serif !important; /* Linkler ve paragraflar için tekrar edildi */
    text-decoration: none;
}

footer a .footer-petrol {
    color: var(--petrol);
}

footer a:hover {
    opacity: 0.7;
}

/* Responsive */
@media(max-width:1050px){
    .container{padding:0 52px}
    header{margin-left:-52px;margin-right:-52px;padding-left:52px;padding-right:52px}
}
@media(max-width:768px){
    body{font-size:17px}
    .container{padding:0 48px}
    header{margin-left:-48px;margin-right:-48px;padding-left:48px;padding-right:48px;padding-top:16px}
    .essay-header h1{font-size:26px}
    .essay-header{padding:36px 0 24px}
    .essay-body blockquote{font-size:17px}
    .essay-body h2{font-size:20px}
    .tagline-on{font-size:20px}
    .tagline-green{font-size:8px}
    .nav-home img{width:32px;height:32px}
    .essay-share-btn svg{width:18px;height:18px}
}
@media(max-width:420px){
    .container{padding:0 32px}
    header{margin-left:-32px;margin-right:-32px;padding-left:32px;padding-right:32px}
    .essay-header h1{font-size:22px}
}

/* Animations */
.fade-in{opacity:0;transform:translateY(12px);animation:fadeUp .6s ease forwards}
.fade-in-delay{animation-delay:.15s}
@keyframes fadeUp{to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}.corridor-vline,.mobile-corridor{display:none}}
