/* base.css — shared editorial shell for mehmetyigili
   Single source of truth for reset, color tokens, typography,
   the sidebar-nav layout, and the footer.
   Page-specific CSS stays inline in each page's <style> and,
   because it is declared AFTER this stylesheet, overrides these
   defaults via normal source-order cascade (e.g. a page can set
   its own .page-name weight or main max-width). */

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

:root{
    --bg:#fff;
    --text:#333;
    --muted:#5e5e5e;
    --light:#767676;
    --line:#e5e5e5;
    --dark:#1a1a1a;
}

::selection{background:#d5d5d5;color:var(--dark)}
html{-webkit-text-size-adjust:100%}

body{
    font-family:'Source Serif 4',Georgia,serif;
    background:var(--bg);
    color:var(--text);
    line-height:1.75;
    font-size:17px;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
}

.layout{display:flex;min-height:100vh;max-width:1060px;margin:0 auto;padding:56px 32px 56px 0}

nav{position:sticky;top:56px;align-self:flex-start;min-width:150px;padding:0 36px 0 32px;text-align:right}
nav a{display:block;font-family:'Inter',sans-serif;font-size:14px;font-weight:400;color:var(--muted);text-decoration:none;padding:4px 0;transition:color .2s}
nav a:hover{color:var(--dark)}
nav a.active{color:var(--dark);font-weight:500;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}

.divider{width:1px;background:var(--line);flex-shrink:0}

main{flex:1;padding-left:48px;max-width:680px}

.page-label{font-family:'Inter',sans-serif;font-size:13px;color:var(--light);margin-bottom:2px}
.page-name{font-size:20px;font-weight:600;color:var(--dark);margin-bottom:28px}

.footer{margin-top:44px;padding-top:18px;border-top:1px solid var(--line);font-family:'Inter',sans-serif;font-size:12px;color:var(--light)}

@media(max-width:768px){
    .layout{flex-direction:column;padding:28px 20px}
    nav{position:static;text-align:left;min-width:auto;padding:0 0 24px 0;display:flex;flex-wrap:wrap;gap:3px 14px}
    nav a{display:inline}
    .divider{width:100%;height:1px}
    main{padding-left:0;padding-top:28px;max-width:100%}
}