@charset "UTF-8";
/* ==========================================================================
   ALİOĞLU HUKUK BÜROSU
   Sistem: "Künye" — ciltli dava dosyası mantığı.
   Mürekkep (zemin) / Kemik (metin) / Pirinç (vurgu) / Bordo (cilt sırtı).
   Mobil öncelikli. Tek kaynaklı boşluk ölçeği. Sıfır bağımlılık.
   ========================================================================== */

/* --- 1. FONTLAR (self-hosted, Türkçe latin-ext dahil) --------------------- */
@font-face{font-family:'Bodoni Moda';font-style:normal;font-weight:400 900;font-display:swap;
  src:url(/assets/fonts/bodoni-latin-ext.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+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:'Bodoni Moda';font-style:normal;font-weight:400 900;font-display:swap;
  src:url(/assets/fonts/bodoni-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD}
@font-face{font-family:'Archivo';font-style:normal;font-weight:300 700;font-display:swap;
  src:url(/assets/fonts/archivo-latin-ext.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+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:'Archivo';font-style:normal;font-weight:300 700;font-display:swap;
  src:url(/assets/fonts/archivo-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD}
@font-face{font-family:'Space Mono';font-style:normal;font-weight:400;font-display:swap;
  src:url(/assets/fonts/spacemono-latin-ext.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+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:'Space Mono';font-style:normal;font-weight:400;font-display:swap;
  src:url(/assets/fonts/spacemono-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD}

/* --- 2. JETONLAR --------------------------------------------------------- */
:root{
  /* Yüzeyler — mürekkep */
  --ink:#0B0B0C; --ink-2:#121214; --ink-3:#1A1A1D; --ink-4:#232327;
  /* Metin — kemik kâğıt */
  --bone:#EDE8E0;        /* mürekkep üstünde 16.2:1 */
  --bone-dim:#9A958D;    /* mürekkep üstünde  6.6:1 */
  --bone-faint:#6E6A64;  /* SADECE metin dışı öğe (ikon/çizgi) — 3.7:1, AA metin altı */
  /* Vurgu — pirinç levha */
  --brass:#C8A250;       /* mürekkep üstünde  8.2:1 */
  --brass-deep:#8A6D2F;
  /* Alan — ciltli içtihat sırtı */
  --oxblood:#5A1A20;     /* kemik metin  10.7:1 */
  --oxblood-2:#43141A;

  --rule:rgba(237,232,224,.14);
  --rule-strong:rgba(237,232,224,.28);
  --brass-rule:rgba(200,162,80,.34);

  /* Tipografi */
  --f-display:'Bodoni Moda',ui-serif,Georgia,'Times New Roman',serif;
  --f-body:'Archivo',ui-sans-serif,system-ui,'Segoe UI',Roboto,sans-serif;
  --f-mono:'Space Mono',ui-monospace,'SFMono-Regular',Consolas,monospace;

  --t-hero:clamp(3.1rem,12.4vw,10.5rem);
  --t-d1:clamp(2.3rem,6vw,5rem);
  --t-d2:clamp(1.8rem,3.5vw,3rem);
  --t-d3:clamp(1.3rem,2vw,1.75rem);
  --t-lead:clamp(1.125rem,1rem + .7vw,1.5rem);
  --t-body:clamp(1rem,.96rem + .2vw,1.0625rem);
  --t-mono:.75rem;

  /* Boşluk — tek kaynak, "spacious" (density 3/10) */
  --s1:.5rem; --s2:1rem; --s3:1.5rem; --s4:2.5rem;
  --s5:4rem;  --s6:6rem; --s7:8.5rem; --s8:12rem;

  --gutter:clamp(1.25rem,5vw,2rem);
  --measure:64ch;
  --rail:0px;              /* masaüstünde büyür */
  --maxw:1440px;

  /* Hareket */
  --ease:cubic-bezier(.16,1,.3,1);
  --ease-io:cubic-bezier(.65,0,.35,1);
  --dur-1:180ms; --dur-2:320ms; --dur-3:620ms;

  /* Gezinme, menünün ÜSTÜNDE kalmalı: aksi hâlde tam ekran menü kendi
     kapatma düğmesini örtüyor ve tek çıkış yolu ESC oluyor. */
  --z-bar:60; --z-menu:90; --z-nav:95; --z-curtain:100;
  --gl-a:#C8A250; --gl-b:#EDE8E0;
}

/* --- 3. TEMEL ------------------------------------------------------------ */
*,*::before,*::after{box-sizing:border-box}
/* Yerel denetimler (onay kutusu, select oku, kaydırma çubuğu) karanlık
   temayla uyumlu çizilsin; aksi hâlde beyaz kutular olarak sırıtıyorlar. */
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:5rem;
     color-scheme:dark}
body{
  margin:0;background:var(--ink);color:var(--bone);
  font-family:var(--f-body);font-size:var(--t-body);font-weight:350;
  line-height:1.65;letter-spacing:.005em;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  /* Sabit mobil eylem çubuğu için yer ayrılır; aksi hâlde sayfa sonundaki
     içerik çubuğun altında kalıyor. 900px üstünde çubuk yok, sıfırlanır. */
  padding-bottom:calc(58px + env(safe-area-inset-bottom));
}
/* Kâğıt dokusu — mürekkep düzlüğünü kırar, 1 KB'lık dahili gürültü */
body::before{
  content:'';position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.038;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}
img,svg{display:block;max-width:100%;height:auto}
h1,h2,h3,h4,p,figure,blockquote,ul,ol,dl{margin:0}
ul,ol{padding:0;list-style:none}

a{color:inherit;text-decoration:none}
:focus{outline:none}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px;border-radius:1px}
::selection{background:var(--brass);color:var(--ink)}

/* Klavye kullanıcısı için atlama bağlantısı */
.skip{
  position:absolute;left:var(--gutter);top:-100px;z-index:200;
  background:var(--brass);color:var(--ink);padding:.85rem 1.25rem;
  font:400 var(--t-mono)/1 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;
  transition:top var(--dur-2) var(--ease);
}
.skip:focus{top:1rem}

/* --- 4. TİPOGRAFİ SINIFLARI ---------------------------------------------- */
/* opsz (optik boy) ekseni bilerek düşük tutuluyor. Bodoni Moda'da opsz 96,
   azami başlık boyu için tasarlanmış uçlardır: ince kollar saç teli inceliğine
   iner ve A ile H gibi harflerde normal ekranlarda görünmez olur. Daha düşük
   opsz aynı didone karakteri korur, ince kolları taşıyacak kadar kalınlaştırır. */
/* Mobil taban bilerek daha "kalın" bir optik boydadır: aynı opsz değeri
   37px'lik bir başlıkta ince kolları 1px altına düşürüp telefonda görünmez
   kılıyor. Geniş ekranda başlıklar büyüdüğü için display uçlarına dönülür. */
.d-hero,.d1,.d2,.d3{
  font-family:var(--f-display);font-weight:600;
  font-variation-settings:'opsz' 22;
  line-height:.94;letter-spacing:-.02em;text-wrap:balance;
}
.d-hero{font-size:var(--t-hero);line-height:.84;letter-spacing:-.035em;font-weight:600;
        font-variation-settings:'opsz' 30}
.d1{font-size:var(--t-d1);line-height:.94}
.d2{font-size:var(--t-d2);line-height:1.02}
.d3{font-size:var(--t-d3);line-height:1.18;letter-spacing:-.01em;font-weight:600;
    font-variation-settings:'opsz' 40}
.it{font-style:italic;font-weight:400}

/* Künye etiketi — tüm bölümlerin ortak mono damgası */
.mono{
  font-family:var(--f-mono);font-size:var(--t-mono);font-weight:400;
  letter-spacing:.2em;text-transform:uppercase;line-height:1.4;
  color:var(--bone-dim);font-variant-numeric:tabular-nums;
}
.mono--brass{color:var(--brass)}

.lead{font-size:var(--t-lead);line-height:1.5;font-weight:300;color:var(--bone);
      max-width:38ch;letter-spacing:-.005em}
.prose{max-width:var(--measure);color:var(--bone-dim)}
.prose p+p{margin-top:var(--s3)}
.prose strong{color:var(--bone);font-weight:600}
.prose a{color:var(--brass);text-decoration:underline;text-underline-offset:.22em;
         text-decoration-thickness:1px;transition:opacity var(--dur-1)}
.prose a:hover{opacity:.72}

/* --- 5. YERLEŞİM --------------------------------------------------------- */
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;
      padding-inline:var(--gutter);padding-left:calc(var(--gutter) + var(--rail))}
.sect{position:relative;padding-block:var(--s6);z-index:2}
.sect--lg{padding-block:var(--s7)}
.sect--flush-t{padding-top:0}
.sect--flush-b{padding-bottom:0}

/* Bölüm başlığı: künye numarası + başlık, cetvelle ayrılmış */
.shead{display:grid;gap:var(--s3);padding-bottom:var(--s4);
       border-bottom:1px solid var(--rule);margin-bottom:var(--s5)}
.shead__meta{display:flex;gap:var(--s3);align-items:baseline;flex-wrap:wrap}
.shead__t{max-width:22ch}

.rule{height:1px;background:var(--rule);border:0;margin:0}
.rule--brass{background:var(--brass-rule)}

/* --- 6. ÜST GEZİNME ------------------------------------------------------ */
.nav{
  position:fixed;inset:0 0 auto 0;z-index:var(--z-nav);
  display:flex;align-items:center;justify-content:space-between;gap:var(--s3);
  padding:var(--s2) var(--gutter);
  padding-top:max(var(--s2),env(safe-area-inset-top));
  background:color-mix(in srgb,var(--ink) 86%,transparent);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid transparent;
  transition:border-color var(--dur-2) var(--ease),background var(--dur-2) var(--ease);
}
.nav[data-stuck="true"]{border-bottom-color:var(--rule)}
.brand{display:flex;align-items:center;gap:.7rem;min-height:44px}
.brand__seal{width:26px;height:26px;color:var(--brass);flex:none}
.brand__txt{font-family:var(--f-display);font-variation-settings:'opsz' 20;
            font-size:1.0625rem;font-weight:600;letter-spacing:.005em;line-height:1}
.brand__txt small{display:block;font:400 .5625rem/1.3 var(--f-mono);
                  letter-spacing:.24em;color:var(--bone-dim);margin-top:.25rem}

.nav__links{display:none}
/* Özgüllük bilinçli olarak yükseltildi: .btn kuralı bu dosyada daha sonra
   geldiği için düz .nav__cta seçicisi display:none'ı kaybediyordu. */
.nav .nav__cta{display:none}

/* Menü düğmesi — mobil ve tablette birincil gezinme */
/* Çubuklar mutlak konumlu: grid/flex satır esnemesi ötelemeyi bozuyordu,
   böylece "X" hesabı düzen moduna bağlı olmaktan çıkar. */
.burger{
  position:relative;display:block;width:48px;height:48px;margin-right:-12px;
  background:none;border:0;color:var(--bone);cursor:pointer;
}
.burger span{position:absolute;left:13px;width:22px;height:1.5px;background:currentColor;
             transition:transform var(--dur-2) var(--ease),opacity var(--dur-1) linear}
.burger span:nth-child(1){top:17px}
.burger span:nth-child(2){top:23.25px}
.burger span:nth-child(3){top:29.5px}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(6.25px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.25px) rotate(-45deg)}

/* Tam ekran menü — masaüstünün küçültülmüşü değil, mobil için tasarlanmış */
.menu{
  position:fixed;inset:0;z-index:var(--z-menu);background:var(--ink);
  display:flex;flex-direction:column;justify-content:center;
  padding:var(--s6) var(--gutter) calc(var(--s5) + env(safe-area-inset-bottom));
  clip-path:inset(0 0 100% 0);visibility:hidden;
  transition:clip-path 560ms var(--ease),visibility 0s linear 560ms;
}
.menu[data-open="true"]{clip-path:inset(0 0 0 0);visibility:visible;transition-delay:0s,0s}
.menu__list{display:grid;gap:var(--s1)}
.menu__list li{overflow:hidden}
.menu__link{
  display:flex;align-items:baseline;gap:var(--s3);padding:.35rem 0;min-height:44px;
  font-family:var(--f-display);font-variation-settings:'opsz' 60;
  font-size:clamp(2rem,9vw,3.25rem);font-weight:500;line-height:1.1;letter-spacing:-.02em;
  transform:translateY(110%);transition:transform 620ms var(--ease),color var(--dur-1);
}
.menu[data-open="true"] .menu__link{transform:translateY(0)}
.menu__link i{font:400 .625rem/1 var(--f-mono);letter-spacing:.2em;color:var(--brass);
              font-style:normal;flex:none}
.menu__link:hover,.menu__link:focus-visible{color:var(--brass)}
.menu__foot{margin-top:var(--s5);display:grid;gap:var(--s2);
            padding-top:var(--s3);border-top:1px solid var(--rule)}
.menu__foot a{min-height:44px;display:flex;align-items:center}

/* --- 7. KÜNYE ŞERİDİ (imza öğesi) ---------------------------------------- */
/* Mobil: üstte ince ilerleme cetveli. Masaüstü: sol kenarda dikey künye. */
.progress{
  position:fixed;top:0;left:0;right:0;height:2px;z-index:var(--z-nav);
  background:var(--brass);transform:scaleX(0);transform-origin:0 50%;
  will-change:transform;
}
.railbar{display:none}

/* --- 8. HERO ------------------------------------------------------------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;
      padding-top:calc(var(--s6) + 3rem);padding-bottom:var(--s5);overflow:clip;z-index:2}
/* Desen viewport'a değil BAŞLIĞA çapalanır. Viewport birimiyle konumlandığında
   telefonda başlığın epey üstünde kalıyor ve ayrı bir görsel gibi okunuyordu. */
.hero__type{position:relative}
.hero__art{
  position:absolute;z-index:-1;pointer-events:none;
  top:50%;left:50%;transform:translate(-50%,-50%);
  width:min(150vw,600px);aspect-ratio:1;opacity:.5;
  -webkit-mask-image:radial-gradient(closest-side,#000 42%,transparent 78%);
          mask-image:radial-gradient(closest-side,#000 42%,transparent 78%);
}
.hero__inner{width:100%;display:grid;gap:var(--s4)}
.hero__eyebrow{display:flex;align-items:center;gap:var(--s2)}
.hero__eyebrow::after{content:'';flex:1;height:1px;background:var(--brass-rule);
                      transform:scaleX(0);transform-origin:0 50%}
.is-ready .hero__eyebrow::after{transform:scaleX(1);transition:transform 1s var(--ease) .45s}

/* Satır satır maske açılışı — clip-path, layout'a dokunmaz (CLS yok) */
.hero__title{margin:0}
/* Maske kutusu bilerek satır kutusundan geniş: line-height .84 ile
   overflow:hidden, Türkçe aksanları (ğ'nin çizgisi, ü/ö noktaları, İ) kırpıyor.
   Negatif margin görsel sıkılığı korur; kırpma alanı ise nefes alır. */
.line{display:block;overflow:hidden;padding:.18em 0 .12em;margin:-.18em 0 -.12em}
.line>span{display:block;transform:translateY(125%)}
.is-ready .line>span{transform:translateY(0);transition:transform 900ms var(--ease)}
.is-ready .line:nth-child(1)>span{transition-delay:.08s}
.is-ready .line:nth-child(2)>span{transition-delay:.18s}
.is-ready .line:nth-child(3)>span{transition-delay:.28s}
.hero__title .it{color:var(--brass)}

.hero__meta{display:grid;gap:var(--s3);opacity:0}
.is-ready .hero__meta{opacity:1;transition:opacity 700ms linear .7s}
.hero__scroll{display:none}

/* --- 9. DÜĞMELER --------------------------------------------------------- */
.btn{
  --bg:transparent;--fg:var(--bone);--bd:var(--rule-strong);
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.75rem;
  min-height:52px;padding:.9rem 1.6rem;
  background:var(--bg);color:var(--fg);border:1px solid var(--bd);cursor:pointer;
  font-family:var(--f-mono);font-size:var(--t-mono);letter-spacing:.18em;text-transform:uppercase;
  overflow:hidden;isolation:isolate;
  transition:color var(--dur-2) var(--ease),border-color var(--dur-2) var(--ease);
}
.btn::before{
  content:'';position:absolute;inset:0;z-index:-1;background:var(--brass);
  transform:scaleX(0);transform-origin:0 50%;
  transition:transform 460ms var(--ease);
}
.btn:hover,.btn:focus-visible{color:var(--ink);border-color:var(--brass)}
.btn:hover::before,.btn:focus-visible::before{transform:scaleX(1)}
.btn:active{transform:translateY(1px)}
.btn--primary{--bg:var(--brass);--fg:var(--ink);--bd:var(--brass);font-weight:400}
.btn--primary::before{background:var(--bone)}
.btn--primary:hover,.btn--primary:focus-visible{color:var(--ink);border-color:var(--bone)}
.btn__arrow{width:1em;height:1em;flex:none;transition:transform var(--dur-2) var(--ease)}
.btn:hover .btn__arrow{transform:translateX(4px)}

/* --- 10. ÇALIŞMA ALANLARI LİSTESİ ---------------------------------------- */
/* Mobil: yığılmış kartlar. Masaüstü: cetvelli kayıt satırları. */
.prax{border-top:1px solid var(--rule)}
.prax__item{border-bottom:1px solid var(--rule)}
.prax__link{
  position:relative;display:grid;gap:var(--s1);
  grid-template-columns:auto 1fr auto;grid-template-areas:'num title arrow' '. desc .';
  align-items:baseline;padding:var(--s3) 0;isolation:isolate;
  transition:padding-inline var(--dur-3) var(--ease);
}
.prax__link::before{
  content:'';position:absolute;inset:-1px 0;z-index:-1;background:var(--oxblood);
  transform:scaleX(0);transform-origin:0 50%;
  transition:transform 560ms var(--ease);
}
.prax__num{grid-area:num;color:var(--brass);align-self:start;padding-top:.45rem}
.prax__title{grid-area:title;font-family:var(--f-display);font-variation-settings:'opsz' 60;
             font-size:clamp(1.5rem,5.4vw,2.15rem);font-weight:500;line-height:1.06;
             letter-spacing:-.015em}
.prax__desc{grid-area:desc;color:var(--bone-dim);font-size:.9375rem;line-height:1.5;
            max-width:52ch;transition:color var(--dur-2)}
.prax__arrow{grid-area:arrow;width:20px;height:20px;color:var(--bone-faint);align-self:center;
             transition:transform var(--dur-3) var(--ease),color var(--dur-2)}
.prax__link:hover,.prax__link:focus-visible{padding-inline:var(--s3)}
.prax__link:hover::before,.prax__link:focus-visible::before{transform:scaleX(1)}
.prax__link:hover .prax__desc,.prax__link:focus-visible .prax__desc{color:var(--bone)}
.prax__link:hover .prax__arrow,.prax__link:focus-visible .prax__arrow{
  transform:translateX(6px) rotate(-45deg);color:var(--brass)}

/* --- 11. BORDO ALAN (ciltli içtihat sırtı) ------------------------------- */
.ox{background:var(--oxblood);color:var(--bone);position:relative;z-index:2}
/* --bone-dim bordo zeminde 4.40:1'e düşüyor (AA altı); zemine göre açılır. */
.ox .mono,.ox .deflist dt{color:rgba(237,232,224,.72)}
.ox .prose{color:rgba(237,232,224,.82)}
.ox .rule{background:rgba(237,232,224,.2)}
.ox .btn{--bd:rgba(237,232,224,.4)}
.ox .btn::before{background:var(--bone)}
.ox .btn:hover,.ox .btn:focus-visible{color:var(--oxblood);border-color:var(--bone)}

/* --- 12. İLKELER / SAYI IZGARASI ----------------------------------------- */
.cols{display:grid;gap:var(--s5)}
.card{display:grid;gap:var(--s2);padding-top:var(--s3);border-top:1px solid var(--rule)}
.card__n{color:var(--brass)}

.deflist{display:grid;gap:var(--s4)}
.deflist div{display:grid;gap:.4rem;padding-top:var(--s2);border-top:1px solid var(--rule)}
.deflist dt{font-family:var(--f-mono);font-size:var(--t-mono);letter-spacing:.2em;
            text-transform:uppercase;color:var(--bone-dim)}
.deflist dd{margin:0;font-size:1.0625rem;line-height:1.5}

/* --- 13. GÖRSEL SANAT YÖNETİMİ ------------------------------------------- */
/* Hangi fotoğraf konursa konsun tek bir sanat yönüne girer: duotone + grade. */
.fig{position:relative;overflow:hidden;background:var(--ink-2);isolation:isolate}
.fig img{width:100%;height:100%;object-fit:cover;
         filter:grayscale(1) contrast(1.08) brightness(.84)}
.fig::after{content:'';position:absolute;inset:0;pointer-events:none;
            background:linear-gradient(202deg,rgba(90,26,32,.62),rgba(200,162,80,.3));
            mix-blend-mode:color}
.fig::before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;
             box-shadow:inset 0 0 0 1px var(--rule)}
.fig--tall{aspect-ratio:3/4}
.fig--wide{aspect-ratio:16/10}
.fig__cap{margin-top:var(--s2);color:var(--bone-dim)}

/* --- 14. SSS (accordion) -------------------------------------------------- */
.faq{border-top:1px solid var(--rule)}
.faq__i{border-bottom:1px solid var(--rule)}
.faq__q{
  width:100%;display:flex;align-items:flex-start;justify-content:space-between;gap:var(--s3);
  padding:var(--s3) 0;min-height:56px;background:none;border:0;color:var(--bone);
  font-family:var(--f-body);font-size:1.0625rem;font-weight:500;line-height:1.4;
  text-align:left;cursor:pointer;transition:color var(--dur-2)
}
.faq__q:hover{color:var(--brass)}
.faq__ic{position:relative;flex:none;width:16px;height:16px;margin-top:.3rem}
.faq__ic::before,.faq__ic::after{content:'';position:absolute;inset:50% 0 auto 0;height:1.5px;
  background:var(--brass);transition:transform var(--dur-2) var(--ease)}
.faq__ic::after{transform:rotate(90deg)}
.faq__q[aria-expanded="true"] .faq__ic::after{transform:rotate(0)}
.faq__a{display:grid;grid-template-rows:0fr;transition:grid-template-rows 420ms var(--ease)}
.faq__i[data-open="true"] .faq__a{grid-template-rows:1fr}
.faq__a>div{overflow:hidden}
.faq__a p{padding-bottom:var(--s3);color:var(--bone-dim);max-width:60ch}

/* --- 15. İLETİŞİM / FORM -------------------------------------------------- */
.field{display:grid;gap:.55rem;margin-bottom:var(--s3)}
.field label{font-family:var(--f-mono);font-size:var(--t-mono);letter-spacing:.18em;
             text-transform:uppercase;color:var(--bone-dim)}
.field label .req{color:var(--brass)}
.field input,.field textarea,.field select{
  width:100%;min-height:52px;padding:.85rem 1rem;
  background:var(--ink-2);border:1px solid var(--rule);color:var(--bone);
  font-family:var(--f-body);font-size:1rem;line-height:1.5;border-radius:0;
  transition:border-color var(--dur-2),background var(--dur-2)
}
.field textarea{min-height:150px;resize:vertical}
.field input:hover,.field textarea:hover,.field select:hover{border-color:var(--rule-strong)}
.field input:focus,.field textarea:focus,.field select:focus{
  border-color:var(--brass);background:var(--ink-3);outline:none}
.field input::placeholder,.field textarea::placeholder{color:var(--bone-dim)}
.field .hint{font-size:.8125rem;color:var(--bone-dim);line-height:1.45}
.field .err{font-size:.8125rem;color:#F2A0A0;display:none}
.field[data-invalid="true"] input,.field[data-invalid="true"] textarea{border-color:#C56B6B}
.field[data-invalid="true"] .err{display:block}
.formnote{padding:var(--s3);border:1px solid var(--rule);background:var(--ink-2);
          color:var(--bone-dim);font-size:.875rem;line-height:1.6}
.check{display:grid;grid-template-columns:auto 1fr;gap:.85rem;align-items:start;
       margin-bottom:var(--s3)}
/* 24x24 asgari işaretçi hedefi (WCAG 2.2 AA 2.5.8) */
.check input{width:24px;height:24px;min-height:0;margin-top:.1rem;accent-color:var(--brass)}
.check label{font-family:var(--f-body);font-size:.875rem;letter-spacing:0;text-transform:none;
             color:var(--bone-dim);line-height:1.55}

/* --- 16. ALT BİLGİ -------------------------------------------------------- */
.foot{border-top:1px solid var(--rule);padding-block:var(--s5) var(--s4);
      position:relative;z-index:2}
.foot__grid{display:grid;gap:var(--s5)}
.foot__mark{display:grid;gap:var(--s3);justify-items:start}
.foot__seal{width:64px;height:64px;color:var(--brass-deep)}
.foot__col h3{margin-bottom:var(--s2)}
.foot__col li+li{margin-top:.65rem}
.foot__col a{color:var(--bone-dim);transition:color var(--dur-1);
             display:inline-flex;min-height:32px;align-items:center}
.foot__col a:hover,.foot__col a:focus-visible{color:var(--brass)}
.foot__legal{margin-top:var(--s5);padding-top:var(--s3);border-top:1px solid var(--rule);
             display:grid;gap:var(--s2)}
/* Yasal uyarı metnidir: --bone-faint 13px'te 3.66:1 kalıyordu, AA altı. */
.foot__disc{max-width:70ch;font-size:.8125rem;line-height:1.6;color:var(--bone-dim)}

/* --- 17. MOBİL EYLEM ÇUBUĞU ---------------------------------------------- */
/* Mobilde asıl dönüşüm yolu: tek dokunuşla ara / yol tarifi al. */
.mbar{
  position:fixed;left:0;right:0;bottom:0;z-index:var(--z-bar);
  display:grid;grid-template-columns:1fr 1fr;
  background:color-mix(in srgb,var(--ink) 94%,transparent);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-top:1px solid var(--rule);
  padding-bottom:env(safe-area-inset-bottom);
  transform:translateY(110%);transition:transform 460ms var(--ease);
}
.mbar[data-show="true"]{transform:translateY(0)}
.mbar a{display:flex;align-items:center;justify-content:center;gap:.6rem;
        min-height:58px;padding:.5rem;
        font-family:var(--f-mono);font-size:var(--t-mono);letter-spacing:.16em;
        text-transform:uppercase;transition:background var(--dur-1)}
.mbar a:first-child{background:var(--brass);color:var(--ink)}
.mbar a:last-child{color:var(--bone);border-left:1px solid var(--rule)}
.mbar a:active{filter:brightness(.9)}
.mbar svg{width:16px;height:16px;flex:none}

/* --- 18. AÇILIŞ PERDESİ --------------------------------------------------- */
.curtain{position:fixed;inset:0;z-index:var(--z-curtain);background:var(--ink);
         display:grid;place-items:center;pointer-events:none}
.curtain__seal{width:52px;height:52px;color:var(--brass-deep);opacity:.85}
.is-ready .curtain{clip-path:inset(0 0 100% 0);
                   transition:clip-path 760ms var(--ease) .15s}
.is-ready .curtain__seal{opacity:0;transition:opacity 280ms linear}
.no-js .curtain{display:none}

/* --- 19. KAYDIRMA AÇILIMLARI --------------------------------------------- */
/* Gizleme YALNIZCA .reveal-on varken geçerlidir; bu sınıfı JS, açılım
   sistemini kurduktan hemen sonra ekler. Böylece JS kapalıysa VEYA betik
   erken hata verirse içerik gizli kalmaz — sadece animasyonsuz görünür. */
.reveal-on [data-reveal]{opacity:0;transform:translateY(14px)}
.reveal-on [data-reveal].in{opacity:1;transform:none;
  transition:opacity 620ms var(--ease),transform 620ms var(--ease)}
.reveal-on [data-reveal="mask"]{opacity:1;transform:none;clip-path:inset(0 0 102% 0)}
/* Bitiş durumundaki negatif kenarlar zorunlu: line-height .94 ile içerik kutusu
   harf sınırlarından kısa kalıyor ve %2'lik pay "g / y / ş" kuyruklarını
   kesiyordu. em cinsinden pay, punto ne olursa olsun yeterli kalır. */
.reveal-on [data-reveal="mask"].in{clip-path:inset(-.15em -.25em -.45em -.25em);
  transition:clip-path 860ms var(--ease)}
.reveal-on [data-reveal="rule"]{opacity:1;transform-origin:0 50%;transform:scaleX(0)}
.reveal-on [data-reveal="rule"].in{transform:scaleX(1);
  transition:transform 900ms var(--ease)}

/* --- 19b. İÇ SAYFA BİLEŞENLERİ ------------------------------------------- */
/* Sayfa başlığı — hero'nun sakin kardeşi */
.phead{position:relative;padding-top:calc(var(--s6) + 3rem);padding-bottom:var(--s5);
       border-bottom:1px solid var(--rule);overflow:clip;z-index:2}
.phead__art{position:absolute;z-index:-1;pointer-events:none;
            width:min(120vw,760px);aspect-ratio:1;top:-30%;right:-38vw;opacity:.34;
            -webkit-mask-image:radial-gradient(closest-side,#000 40%,transparent 76%);
                    mask-image:radial-gradient(closest-side,#000 40%,transparent 76%)}
.phead__t{margin-top:var(--s3);max-width:18ch}
.phead .lead{margin-top:var(--s4)}

/* Kırıntı yolu — 3+ seviye derinlikte yön duygusu */
.crumbs{padding-top:var(--s2)}
.crumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.crumbs li{display:flex;align-items:center;gap:.5rem}
.crumbs li+li::before{content:'/';color:var(--bone-dim)}
.crumbs a{color:var(--bone-dim);min-height:32px;display:inline-flex;align-items:center;
          transition:color var(--dur-1)}
.crumbs a:hover,.crumbs a:focus-visible{color:var(--brass)}
.crumbs [aria-current]{color:var(--bone)}

/* Kapsam listesi — madde değil, kayıt satırı */
.scope{display:grid;gap:0;border-top:1px solid var(--rule)}
.scope li{display:grid;grid-template-columns:2.5rem 1fr;gap:var(--s2);align-items:baseline;
          padding:var(--s2) 0;border-bottom:1px solid var(--rule)}
.scope li span:first-child{color:var(--brass);font-family:var(--f-mono);
                           font-size:var(--t-mono);letter-spacing:.14em}

/* İletişim düzeni */
.contact{display:grid;gap:var(--s6)}
.contact__aside{display:grid;gap:var(--s4);align-content:start}
.map{border:1px solid var(--rule);filter:grayscale(1) invert(.92) contrast(.85);
     width:100%;aspect-ratio:4/3;display:block}

/* Ekip kartı */
.team{display:grid;gap:var(--s5)}
.member{display:grid;gap:var(--s3)}
.member__ph{aspect-ratio:3/4;background:var(--ink-2);border:1px solid var(--rule);
            display:grid;place-items:center;color:var(--bone-faint)}
.member__ph svg{width:44px;height:44px;opacity:.5}

.note{padding:var(--s3);border-left:2px solid var(--brass);background:var(--ink-2);
      color:var(--bone-dim);font-size:.9375rem;line-height:1.65}
.note strong{color:var(--bone)}

/* --- 19c. YARDIMCI SINIFLAR ---------------------------------------------- */
/* Satır içi style="" öznitelikleri bilerek kullanılmıyor: üretimdeki CSP
   başlığı (style-src 'self') bunları engelliyor — 'self' inline stilleri
   KAPSAMAZ, bunun için 'unsafe-inline' gerekir. Güvenliği zayıflatmak yerine
   her düzen kararı burada sınıfa bağlanır. */
.u-mt2{margin-top:var(--s2)}
.u-mt3{margin-top:var(--s3)}
.u-mt4{margin-top:var(--s4)}
.u-mt5{margin-top:var(--s5)}
.u-mt6{margin-top:var(--s6)}
.u-mts{margin-top:.5rem}
.u-mtm{margin-top:.75rem}
.u-mb2{margin-bottom:var(--s2)}
.u-mb3{margin-bottom:var(--s3)}
.u-mb4{margin-bottom:var(--s4)}
.u-mb5{margin-bottom:var(--s5)}
.u-pt4{padding-top:var(--s4)}
.u-pt5{padding-top:var(--s5)}
.u-h2{margin:var(--s4) 0 var(--s2)}
.u-row{display:flex;gap:var(--s2);flex-wrap:wrap}
.u-split{display:flex;justify-content:space-between;gap:var(--s3);flex-wrap:wrap}
.u-stack{display:grid;gap:.35rem}
.u-narrow{max-width:16ch}
.u-measure{max-width:70ch}
.u-col1{grid-template-columns:1fr}
.u-full{width:100%}
.u-sm{font-size:.9375rem}
.u-fine{font-size:.875rem;color:var(--bone-dim)}
.u-addr{font-style:normal;line-height:1.9}
.u-err{border-left-color:#C56B6B}
/* Bal küpü: ekran okuyucudan ve gözden gizli, ama bot için doldurulabilir */
.u-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* --- 20. KIRILMA NOKTALARI ----------------------------------------------- */
@media (min-width:600px){
  .cols--2{grid-template-columns:repeat(2,1fr)}
  .deflist{grid-template-columns:repeat(2,1fr);gap:var(--s4) var(--s5)}
  .team{grid-template-columns:repeat(2,1fr)}
  .hero__art{width:min(105vw,780px);left:auto;right:-20vw;
             transform:translateY(-50%);opacity:.5}
  .foot__grid{grid-template-columns:repeat(2,1fr)}
}

@media (min-width:900px){
  :root{--rail:96px}
  .prax__link{grid-template-columns:5.5rem 1fr 2rem;
              grid-template-areas:'num title arrow' 'num desc arrow';
              gap:var(--s1) var(--s4);padding-block:var(--s4)}
  .prax__num{padding-top:.75rem}
  .cols--3{grid-template-columns:repeat(3,1fr)}
  .cols--4{grid-template-columns:repeat(4,1fr)}
  .team{grid-template-columns:repeat(3,1fr)}
  .contact{grid-template-columns:1.15fr .85fr;gap:var(--s7)}
  .phead__art{width:min(60vw,700px);right:-10vw;top:-40%}
  .shead{grid-template-columns:1fr 1fr;align-items:end;gap:var(--s5)}
  .foot__grid{grid-template-columns:1.4fr 1fr 1fr}
  .mbar{display:none}
  body{padding-bottom:0}

  /* Masaüstünde tam menü açığa çıkar, hamburger gizlenir */
  .burger{display:none}
  .menu{position:static;clip-path:none;visibility:visible;display:none}
  .nav__links{display:flex;align-items:center;gap:var(--s4)}
  .nav__links a{
    position:relative;font-family:var(--f-mono);font-size:var(--t-mono);
    letter-spacing:.16em;text-transform:uppercase;color:var(--bone-dim);
    display:inline-flex;align-items:center;min-height:44px;
    transition:color var(--dur-2)
  }
  .nav__links a::after{content:'';position:absolute;left:0;right:0;bottom:12px;height:1px;
    background:var(--brass);transform:scaleX(0);transform-origin:0 50%;
    transition:transform 420ms var(--ease)}
  .nav__links a:hover,.nav__links a:focus-visible,
  .nav__links a[aria-current="page"]{color:var(--bone)}
  .nav__links a:hover::after,.nav__links a:focus-visible::after,
  .nav__links a[aria-current="page"]::after{transform:scaleX(1)}
  .nav .nav__cta{display:inline-flex;min-height:44px;padding:.7rem 1.35rem}

  /* Künye şeridi — dikey dosya numarası + ilerleme cetveli */
  .progress{display:none}
  .railbar{
    display:flex;flex-direction:column;align-items:center;gap:var(--s3);
    position:fixed;left:0;top:0;bottom:0;width:var(--rail);z-index:var(--z-bar);
    padding-block:calc(var(--s6) + 1rem) var(--s4);
    border-right:1px solid var(--rule);pointer-events:none;
    /* Cilt sırtı: bilerek opak. Sabit katmanın altındaki alanı tarayıcı
       kompozitörüne bırakmak, bordo bölümde tarayıcıdan tarayıcıya değişen
       bir şerit üretiyordu; renk burada açıkça sabitlenir. */
    background:var(--ink);
  }
  .railbar__track{position:relative;flex:1;width:1px;background:var(--rule)}
  .railbar__fill{position:absolute;inset:0 0 auto 0;background:var(--brass);
                 transform:scaleY(0);transform-origin:50% 0;will-change:transform}
  .railbar__label{writing-mode:vertical-rl;transform:rotate(180deg);
                  white-space:nowrap;color:var(--bone-dim);
                  transition:opacity var(--dur-2) var(--ease)}
  .railbar__num{color:var(--brass)}

  .hero{align-items:center}
  .hero__inner{gap:var(--s5)}
  .hero__art{width:min(72vw,980px);left:auto;right:-12vw;
             transform:translateY(-50%);opacity:.55}
  .hero__meta{grid-template-columns:auto auto;gap:var(--s5);align-items:center;
              justify-content:start}
  .hero__scroll{display:flex;align-items:center;gap:.75rem;
                position:absolute;bottom:var(--s4);right:var(--gutter)}
  .hero__scroll span{display:block;width:44px;height:1px;background:var(--brass-rule);
                     position:relative;overflow:hidden}
  .hero__scroll span::after{content:'';position:absolute;inset:0;background:var(--brass);
    animation:sweep 2.4s var(--ease-io) infinite}
  @keyframes sweep{0%{transform:translateX(-100%)}55%,100%{transform:translateX(100%)}}
}

@media (min-width:1200px){
  .lead{max-width:34ch}
  .shead__t{max-width:26ch}
}

@media (min-width:900px){
  /* Başlıklar bu genişlikten sonra display ölçeğine çıkar; ince kollar
     yeterince kalın kaldığı için didone uçlarına geri dönülür. */
  .d1,.d2{font-variation-settings:'opsz' 44;font-weight:500}
  .d-hero{font-variation-settings:'opsz' 34}
}

/* --- 21. ERİŞİLEBİLİRLİK TERCİHLERİ -------------------------------------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01ms !important;animation-iteration-count:1 !important;
    transition-duration:.01ms !important;scroll-behavior:auto !important}
  .reveal-on [data-reveal],.reveal-on [data-reveal].in{
    opacity:1;transform:none;clip-path:none}
  .line>span{transform:none}
  .hero__meta{opacity:1}
  .curtain{display:none}
  .menu__link{transform:none}
  .hero__scroll span::after{animation:none;transform:none}
}
@media (prefers-contrast:more){
  :root{--bone-dim:#CFC9C0;--rule:rgba(237,232,224,.34);--bone-faint:#A29D95}
}
@media print{
  .nav,.menu,.mbar,.railbar,.progress,.curtain,.hero__art,body::before{display:none !important}
  body{background:#fff;color:#000}
  .ox{background:#fff;color:#000}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:.8em}
}
