/* =========================================================
   Biolink — ortak stil (ortak/stil.css)
   Tüm sayfalar bu dosyayı kullanır.

   Piksel motifi SADECE sayfayı bölen çizgilerde kullanılır (.serit).
   Butonlar, kartlar ve ikonlar sade, yumuşak köşelidir.
   Vurgu rengi logodaki bronz.
   ========================================================= */

/* Yazı ailesi: Schibsted Grotesk (SIL Open Font License), sitenin içinde, internet gerekmez */
@font-face{font-family:"Schibsted Grotesk";font-style:normal;font-display:swap;font-weight:400 900;
  src:url("yazi/schibsted-grotesk-latin-ext-wght-normal.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:"Schibsted Grotesk";font-style:normal;font-display:swap;font-weight:400 900;
  src:url("yazi/schibsted-grotesk-latin-wght-normal.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}

:root{
  /* Renkler — açık tema (taş zemin, bronz vurgu) */
  --zemin:#ebe7df;        /* sayfa zemini */
  --yuzey:#f6f4ef;        /* kart, panel */
  --yuzey-2:#e1dcd2;      /* ikinci ton: araç grupları, pasif alanlar */
  --murekkep:#1f1b16;     /* ana yazı */
  --soluk:#625b51;        /* ikincil yazı */
  --bronz:#8a5d30;        /* vurgu: ana butonlar, seçili öğeler */
  --bronz-acik:#c09868;   /* logodaki bronz, dekor ve şerit */
  --bronz-yazi:#ffffff;   /* bronz üstündeki yazı */
  --uyari:#9a4a12;
  --golge:0 18px 40px -18px rgba(40,28,14,.35);

  /* Eski adlar (modüller bunları kullanıyor) */
  --bg:var(--zemin); --surface:var(--yuzey); --surface-2:var(--yuzey-2);
  --border:var(--yuzey-2); --text:var(--murekkep); --muted:var(--soluk);
  --accent:var(--bronz); --accent-text:var(--bronz-yazi);

  /* Yazı */
  --yazi:"Schibsted Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --boy-dev:clamp(2.6rem, 1.4rem + 5.4vw, 6.2rem);   /* tek büyük başlık */
  --boy-buyuk:clamp(1.9rem, 1.3rem + 2.4vw, 3.2rem); /* bölüm başlıkları */
  --boy-orta:clamp(1.2rem, 1.05rem + .5vw, 1.45rem); /* ara başlık, vurgu cümlesi */
  --boy-metin:1.0625rem;
  --boy-kucuk:.875rem;

  /* Düzen */
  --max:1180px;
  --kenar:clamp(16px, 4vw, 40px);
  --bolum:clamp(88px, 12vw, 176px);

  /* Köşeler */
  --kose:10px;
  --kose-buyuk:18px;

  /* Hareket */
  --ease-out:cubic-bezier(.22,1,.36,1);
  --ease-in-out:cubic-bezier(.76,0,.24,1);
  --t-bas:140ms; --t-uzerine:180ms; --t-arayuz:240ms; --t-giris:800ms;

  color-scheme:light;
}

/* Karanlık tema */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --zemin:#13110e; --yuzey:#1d1a16; --yuzey-2:#2a2620;
    --murekkep:#efe9df; --soluk:#a69d90;
    --bronz:#c99561; --bronz-acik:#c09868; --bronz-yazi:#1a140c; --uyari:#f0a25a;
    --golge:0 18px 40px -18px rgba(0,0,0,.7);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --zemin:#13110e; --yuzey:#1d1a16; --yuzey-2:#2a2620;
  --murekkep:#efe9df; --soluk:#a69d90;
  --bronz:#c99561; --bronz-acik:#c09868; --bronz-yazi:#1a140c; --uyari:#f0a25a;
  --golge:0 18px 40px -18px rgba(0,0,0,.7);
  color-scheme:dark;
}

/* ---------- Temel ---------- */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0}
html{-webkit-text-size-adjust:100%}
body{
  min-height:100vh; min-height:100svh; display:flex; flex-direction:column;
  background:var(--zemin); color:var(--murekkep);
  font-family:var(--yazi); font-size:var(--boy-metin); line-height:1.55;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  transition:background-color var(--t-arayuz) ease, color var(--t-arayuz) ease;
}
img,svg,canvas{display:block;max-width:100%}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3{margin:0;font-weight:800;letter-spacing:-.025em;line-height:1.02;text-wrap:balance}
p{margin:0;text-wrap:pretty}
::selection{background:var(--bronz);color:var(--bronz-yazi)}
:focus-visible{outline:2px solid var(--bronz);outline-offset:3px}

.sayfa{flex:1;width:100%;max-width:var(--max);margin:0 auto;padding:clamp(28px,5vw,56px) var(--kenar) var(--bolum)}
.gizli-baslik{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Butonlar (piksel köşeli) ---------- */
.dugme{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:48px;padding:0 24px;border:0;cursor:pointer;
  border-radius:var(--kose);
  background:var(--bronz);color:var(--bronz-yazi);
  font-weight:700;font-size:1rem;text-decoration:none;white-space:nowrap;
  transition:transform var(--t-bas) var(--ease-out), background-color var(--t-uzerine) ease, filter var(--t-uzerine) ease;
}
.dugme:hover{filter:brightness(1.08)}
.dugme:active{transform:translateY(2px)}
.dugme-ikincil{background:var(--yuzey-2);color:var(--murekkep)}
.dugme-ikincil:hover{filter:none;background:color-mix(in srgb,var(--yuzey-2) 80%,var(--murekkep))}
.dugme-kucuk{min-height:38px;padding:0 16px;font-size:.9rem}


/* ---------- Piksel şerit: sayfayı bölen çizgi (tek piksel öğe) ---------- */
.serit{
  /* 64 × 8 piksellik şerit; renk temadan gelir */
  --serit-yukseklik:12px;
  height:var(--serit-yukseklik);width:100%;
  background:var(--bronz-acik);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 8' shape-rendering='crispEdges'%3E%3Cpath d='M3 0h1v1h-1zM5 0h1v1h-1zM6 0h1v1h-1zM7 0h1v1h-1zM10 0h1v1h-1zM16 0h1v1h-1zM18 0h1v1h-1zM26 0h2v1h-2zM43 0h1v1h-1zM47 0h1v1h-1zM60 0h1v1h-1zM0 1h1v1h-1zM2 1h1v1h-1zM3 1h3v1h-3zM6 1h1v1h-1zM9 1h1v1h-1zM14 1h1v1h-1zM18 1h1v1h-1zM19 1h1v1h-1zM22 1h2v1h-2zM31 1h1v1h-1zM37 1h1v1h-1zM38 1h2v1h-2zM40 1h1v1h-1zM41 1h4v1h-4zM45 1h1v1h-1zM47 1h1v1h-1zM48 1h1v1h-1zM49 1h1v1h-1zM53 1h2v1h-2zM55 1h1v1h-1zM56 1h2v1h-2zM59 1h1v1h-1zM60 1h1v1h-1zM0 2h1v1h-1zM1 2h1v1h-1zM2 2h1v1h-1zM3 2h2v1h-2zM10 2h1v1h-1zM11 2h5v1h-5zM17 2h1v1h-1zM20 2h5v1h-5zM27 2h1v1h-1zM29 2h1v1h-1zM33 2h2v1h-2zM35 2h1v1h-1zM37 2h1v1h-1zM40 2h3v1h-3zM44 2h1v1h-1zM47 2h1v1h-1zM48 2h2v1h-2zM51 2h1v1h-1zM52 2h1v1h-1zM54 2h4v1h-4zM58 2h1v1h-1zM59 2h1v1h-1zM60 2h1v1h-1zM61 2h1v1h-1zM62 2h1v1h-1zM63 2h1v1h-1zM0 3h1v1h-1zM1 3h1v1h-1zM2 3h2v1h-2zM4 3h1v1h-1zM5 3h1v1h-1zM6 3h1v1h-1zM7 3h1v1h-1zM8 3h1v1h-1zM9 3h2v1h-2zM11 3h1v1h-1zM12 3h1v1h-1zM13 3h1v1h-1zM14 3h1v1h-1zM15 3h1v1h-1zM16 3h1v1h-1zM18 3h1v1h-1zM20 3h1v1h-1zM22 3h3v1h-3zM25 3h3v1h-3zM28 3h1v1h-1zM29 3h1v1h-1zM30 3h2v1h-2zM33 3h1v1h-1zM34 3h1v1h-1zM36 3h2v1h-2zM38 3h4v1h-4zM42 3h1v1h-1zM43 3h3v1h-3zM46 3h2v1h-2zM48 3h1v1h-1zM49 3h3v1h-3zM52 3h3v1h-3zM55 3h3v1h-3zM58 3h1v1h-1zM59 3h2v1h-2zM61 3h2v1h-2zM63 3h1v1h-1zM0 4h2v1h-2zM2 4h1v1h-1zM3 4h2v1h-2zM6 4h2v1h-2zM8 4h7v1h-7zM15 4h1v1h-1zM16 4h5v1h-5zM21 4h2v1h-2zM24 4h1v1h-1zM25 4h1v1h-1zM26 4h2v1h-2zM28 4h1v1h-1zM29 4h1v1h-1zM30 4h1v1h-1zM31 4h5v1h-5zM36 4h3v1h-3zM40 4h4v1h-4zM44 4h1v1h-1zM45 4h1v1h-1zM47 4h2v1h-2zM49 4h4v1h-4zM53 4h2v1h-2zM55 4h8v1h-8zM63 4h1v1h-1zM4 5h1v1h-1zM6 5h1v1h-1zM8 5h1v1h-1zM13 5h1v1h-1zM14 5h1v1h-1zM17 5h1v1h-1zM20 5h3v1h-3zM23 5h1v1h-1zM24 5h1v1h-1zM27 5h2v1h-2zM30 5h1v1h-1zM32 5h1v1h-1zM33 5h3v1h-3zM36 5h1v1h-1zM38 5h1v1h-1zM39 5h1v1h-1zM43 5h3v1h-3zM46 5h1v1h-1zM47 5h3v1h-3zM52 5h1v1h-1zM53 5h1v1h-1zM54 5h1v1h-1zM55 5h1v1h-1zM57 5h1v1h-1zM60 5h3v1h-3zM63 5h1v1h-1zM1 6h1v1h-1zM3 6h1v1h-1zM7 6h1v1h-1zM9 6h2v1h-2zM12 6h2v1h-2zM14 6h1v1h-1zM15 6h1v1h-1zM17 6h1v1h-1zM20 6h1v1h-1zM26 6h3v1h-3zM29 6h1v1h-1zM30 6h1v1h-1zM32 6h1v1h-1zM41 6h1v1h-1zM45 6h2v1h-2zM47 6h1v1h-1zM48 6h1v1h-1zM51 6h1v1h-1zM52 6h1v1h-1zM54 6h2v1h-2zM58 6h1v1h-1zM61 6h1v1h-1zM62 6h1v1h-1zM63 6h1v1h-1zM10 7h1v1h-1zM12 7h1v1h-1zM23 7h2v1h-2zM28 7h1v1h-1zM34 7h1v1h-1zM43 7h1v1h-1zM48 7h1v1h-1zM51 7h2v1h-2zM57 7h1v1h-1z'/%3E%3C/svg%3E") 0 0/calc(var(--serit-yukseklik)*8) var(--serit-yukseklik) repeat-x;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 8' shape-rendering='crispEdges'%3E%3Cpath d='M3 0h1v1h-1zM5 0h1v1h-1zM6 0h1v1h-1zM7 0h1v1h-1zM10 0h1v1h-1zM16 0h1v1h-1zM18 0h1v1h-1zM26 0h2v1h-2zM43 0h1v1h-1zM47 0h1v1h-1zM60 0h1v1h-1zM0 1h1v1h-1zM2 1h1v1h-1zM3 1h3v1h-3zM6 1h1v1h-1zM9 1h1v1h-1zM14 1h1v1h-1zM18 1h1v1h-1zM19 1h1v1h-1zM22 1h2v1h-2zM31 1h1v1h-1zM37 1h1v1h-1zM38 1h2v1h-2zM40 1h1v1h-1zM41 1h4v1h-4zM45 1h1v1h-1zM47 1h1v1h-1zM48 1h1v1h-1zM49 1h1v1h-1zM53 1h2v1h-2zM55 1h1v1h-1zM56 1h2v1h-2zM59 1h1v1h-1zM60 1h1v1h-1zM0 2h1v1h-1zM1 2h1v1h-1zM2 2h1v1h-1zM3 2h2v1h-2zM10 2h1v1h-1zM11 2h5v1h-5zM17 2h1v1h-1zM20 2h5v1h-5zM27 2h1v1h-1zM29 2h1v1h-1zM33 2h2v1h-2zM35 2h1v1h-1zM37 2h1v1h-1zM40 2h3v1h-3zM44 2h1v1h-1zM47 2h1v1h-1zM48 2h2v1h-2zM51 2h1v1h-1zM52 2h1v1h-1zM54 2h4v1h-4zM58 2h1v1h-1zM59 2h1v1h-1zM60 2h1v1h-1zM61 2h1v1h-1zM62 2h1v1h-1zM63 2h1v1h-1zM0 3h1v1h-1zM1 3h1v1h-1zM2 3h2v1h-2zM4 3h1v1h-1zM5 3h1v1h-1zM6 3h1v1h-1zM7 3h1v1h-1zM8 3h1v1h-1zM9 3h2v1h-2zM11 3h1v1h-1zM12 3h1v1h-1zM13 3h1v1h-1zM14 3h1v1h-1zM15 3h1v1h-1zM16 3h1v1h-1zM18 3h1v1h-1zM20 3h1v1h-1zM22 3h3v1h-3zM25 3h3v1h-3zM28 3h1v1h-1zM29 3h1v1h-1zM30 3h2v1h-2zM33 3h1v1h-1zM34 3h1v1h-1zM36 3h2v1h-2zM38 3h4v1h-4zM42 3h1v1h-1zM43 3h3v1h-3zM46 3h2v1h-2zM48 3h1v1h-1zM49 3h3v1h-3zM52 3h3v1h-3zM55 3h3v1h-3zM58 3h1v1h-1zM59 3h2v1h-2zM61 3h2v1h-2zM63 3h1v1h-1zM0 4h2v1h-2zM2 4h1v1h-1zM3 4h2v1h-2zM6 4h2v1h-2zM8 4h7v1h-7zM15 4h1v1h-1zM16 4h5v1h-5zM21 4h2v1h-2zM24 4h1v1h-1zM25 4h1v1h-1zM26 4h2v1h-2zM28 4h1v1h-1zM29 4h1v1h-1zM30 4h1v1h-1zM31 4h5v1h-5zM36 4h3v1h-3zM40 4h4v1h-4zM44 4h1v1h-1zM45 4h1v1h-1zM47 4h2v1h-2zM49 4h4v1h-4zM53 4h2v1h-2zM55 4h8v1h-8zM63 4h1v1h-1zM4 5h1v1h-1zM6 5h1v1h-1zM8 5h1v1h-1zM13 5h1v1h-1zM14 5h1v1h-1zM17 5h1v1h-1zM20 5h3v1h-3zM23 5h1v1h-1zM24 5h1v1h-1zM27 5h2v1h-2zM30 5h1v1h-1zM32 5h1v1h-1zM33 5h3v1h-3zM36 5h1v1h-1zM38 5h1v1h-1zM39 5h1v1h-1zM43 5h3v1h-3zM46 5h1v1h-1zM47 5h3v1h-3zM52 5h1v1h-1zM53 5h1v1h-1zM54 5h1v1h-1zM55 5h1v1h-1zM57 5h1v1h-1zM60 5h3v1h-3zM63 5h1v1h-1zM1 6h1v1h-1zM3 6h1v1h-1zM7 6h1v1h-1zM9 6h2v1h-2zM12 6h2v1h-2zM14 6h1v1h-1zM15 6h1v1h-1zM17 6h1v1h-1zM20 6h1v1h-1zM26 6h3v1h-3zM29 6h1v1h-1zM30 6h1v1h-1zM32 6h1v1h-1zM41 6h1v1h-1zM45 6h2v1h-2zM47 6h1v1h-1zM48 6h1v1h-1zM51 6h1v1h-1zM52 6h1v1h-1zM54 6h2v1h-2zM58 6h1v1h-1zM61 6h1v1h-1zM62 6h1v1h-1zM63 6h1v1h-1zM10 7h1v1h-1zM12 7h1v1h-1zM23 7h2v1h-2zM28 7h1v1h-1zM34 7h1v1h-1zM43 7h1v1h-1zM48 7h1v1h-1zM51 7h2v1h-2zM57 7h1v1h-1z'/%3E%3C/svg%3E") 0 0/calc(var(--serit-yukseklik)*8) var(--serit-yukseklik) repeat-x;
  image-rendering:pixelated;
}
.serit-ince{--serit-yukseklik:8px}
.serit-bolum{margin-top:var(--bolum)}

/* ---------- Henüz hazırlanmayan sayfalar ---------- */
.hazirlaniyor{display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding:clamp(32px,8vw,96px) 0}
.hazirlaniyor h1{font-size:var(--boy-buyuk)}
.hazirlaniyor p{color:var(--soluk);max-width:46ch}

/* ---------- Giriş animasyonları (sadece JS varken) ---------- */
html.js [data-gorun]{opacity:0;transform:translateY(24px)}
html.js [data-gorun].gorundu{opacity:1;transform:none;transition:opacity var(--t-giris) var(--ease-out), transform var(--t-giris) var(--ease-out);transition-delay:var(--gecikme,0ms)}

@media (prefers-reduced-motion:reduce){
  html.js [data-gorun]{opacity:1;transform:none}
  *,*::before,*::after{transition-duration:1ms !important;animation-duration:1ms !important;animation-iteration-count:1 !important}
}

/* ==========================================================
   Ortak tasarım dili (2026 yenileme)
   Ana sayfadaki plan kartları ve plan sayfasındaki kutuyla aynı aile:
   yumuşak üst ışık, ince çerçeve, imleci izleyen ışık huzmesi.
   ========================================================== */
.sayfa-etiket{margin-bottom:10px;display:inline-flex;align-items:center;gap:8px;width:max-content;padding:5px 11px;border-radius:999px;background:var(--yuzey-2);color:var(--soluk);font-size:.8rem;font-weight:700;line-height:1.3}
.sayfa-etiket svg{width:12px;height:12px;fill:currentColor;shape-rendering:crispEdges}

/* Kart: .huzme sınıfı alan her kutu */
.sayfa .huzme{--x:50%;position:relative;isolation:isolate;border-radius:22px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--bronz-acik) 12%,var(--yuzey)),var(--yuzey) 140px);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--murekkep) 7%,transparent),0 26px 50px -38px rgba(40,28,14,.5);
  transition:box-shadow var(--t-arayuz) var(--ease-out)}
.sayfa .huzme::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;
  background:radial-gradient(420px 240px at var(--x) -70px,color-mix(in srgb,var(--bronz-acik) 42%,transparent),color-mix(in srgb,var(--bronz-acik) 12%,transparent) 55%,transparent 75%);
  opacity:0;transition:opacity 260ms ease}
.sayfa .huzme::after{content:"";position:absolute;left:18px;right:18px;top:0;height:2px;border-radius:2px;pointer-events:none;
  background:linear-gradient(90deg,transparent,var(--bronz) calc(var(--x) - 22%),var(--bronz-acik) var(--x),var(--bronz) calc(var(--x) + 22%),transparent);
  opacity:0;transition:opacity 260ms ease}
.sayfa .huzme:hover,.sayfa .huzme:focus-within{box-shadow:0 0 0 1px color-mix(in srgb,var(--bronz) 30%,transparent),0 30px 56px -36px rgba(60,40,20,.55)}
.sayfa .huzme:hover::before,.sayfa .huzme:hover::after,.sayfa .huzme:focus-within::before,.sayfa .huzme:focus-within::after{opacity:1}
.sayfa .huzme.surekli::before{opacity:.5}
.sayfa .huzme.surekli::after{opacity:.6}

/* Bölümlü seçim (sekme, tema, dil): dock ile aynı hap biçimi */
.sayfa .sekmeler,.sayfa .secim{border-radius:999px;padding:4px;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--murekkep) 6%,transparent)}
.sayfa .sekme,.sayfa .secim button{border-radius:999px}
.sayfa .sekme[aria-selected="true"],.sayfa .secim button[aria-checked="true"]{background:var(--yuzey);color:var(--murekkep);box-shadow:0 1px 2px rgba(40,28,14,.14),0 0 0 1px color-mix(in srgb,var(--bronz) 22%,transparent)}

/* Yan menü (Ayarlar, Yasal): etkin öğede bronz işaret */
.sayfa .yan nav a,.sayfa .yan ul a{position:relative;border-radius:999px;padding-left:16px}
.sayfa .yan a[aria-current="true"]{background:var(--yuzey);color:var(--murekkep);box-shadow:0 0 0 1px color-mix(in srgb,var(--murekkep) 7%,transparent)}
.sayfa .yan a[aria-current="true"]::before{content:"";position:absolute;left:6px;top:50%;width:4px;height:4px;margin-top:-2px;background:var(--bronz)}

/* Girdiler: odakta bronz halka */
.sayfa .girdi:focus,.sayfa input:focus-visible,.sayfa textarea:focus-visible{box-shadow:0 0 0 4px color-mix(in srgb,var(--bronz) 16%,transparent)}

@media (prefers-reduced-motion:reduce){.sayfa .huzme::before,.sayfa .huzme::after{transition:none}}

/* Mobilde alttaki menü (dock) kaydet çubuğunu örtmesin */
@media (max-width:900px){.sayfa .kaydet-cubuk{bottom:92px}}
