/* ============================================================
   Demirciefe Hukuk Ofisi — marka: siyah mürekkep + dövme altın
   Renkler Instagram kurumsal postundan örneklendi.
   ============================================================ */

:root{
  --ink:      #000000;   /* zemin — kurumsal postun saf siyahı; portrelerle birebir uyum */
  --ink-2:    #131110;   /* yükseltilmiş yüzey */
  --ink-3:    #1B1816;   /* kart iç yüzey */
  --gold:     #C79A52;   /* logo metin gövdesi */
  --gold-deep:#8A6A3B;   /* gradient koyu uç */
  --gold-lit: #E3C179;   /* dekoratif çizgilerin parlama noktası */
  --bone:     #E8E4DC;   /* ana metin */
  --bone-dim: #9A938A;   /* ikincil metin */
  --line:     rgba(199,154,82,.20);
  --line-soft:rgba(232,228,220,.09);

  --serif: "Marcellus", "Hoefler Text", Georgia, "Times New Roman", serif;
  --sans:  "Jost", "Avenir Next", "Segoe UI", system-ui, -apple-system, sans-serif;

  --pad: clamp(1.4rem, 5.5vw, 3rem);
  --max: 1180px;
  --sec: clamp(3.75rem, 10vw, 8.5rem);   /* bölüm dikey nefesi */
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0;
  background:var(--ink);
  color:var(--bone);
  font-family:var(--sans);
  font-weight:300;
  font-size:clamp(1rem, .96rem + .2vw, 1.0625rem);
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  padding-bottom:calc(54px + env(safe-area-inset-bottom, 0px));   /* mobil çağrı çubuğu */
}

img,svg{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }

:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; border-radius:2px; }

.skip{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--gold); color:var(--ink); padding:.7rem 1.1rem; font-size:.9rem;
}
.skip:focus{ left:.5rem; top:.5rem; }

.wrap{ width:100%; max-width:var(--max); margin-inline:auto; padding-inline:var(--pad); }

/* ---------- tipografi ---------- */
h1,h2,h3,h4{ font-family:var(--serif); font-weight:400; line-height:1.16; text-wrap:balance; margin:0; }
h1{ font-size:clamp(1.95rem, 1.3rem + 3.4vw, 3.7rem); letter-spacing:-.005em; line-height:1.2; }
h2{ font-size:clamp(1.55rem, 1.15rem + 2.1vw, 2.9rem); }
h3{ font-size:clamp(1.15rem, 1.02rem + .55vw, 1.4rem); }
p{ margin:0; }

.eyebrow{
  font-size:.72rem; font-weight:400; letter-spacing:.26em; text-transform:uppercase;
  color:var(--gold); margin:0;
}
.lede{ font-size:clamp(1.05rem, 1rem + .35vw, 1.2rem); color:var(--bone-dim); line-height:1.8; max-width:62ch; }
.dim{ color:var(--bone-dim); }
.measure{ max-width:65ch; }

/* ---------- marka imzası: postun paralel altın çizgileri ---------- */
.motif{
  height:58px; width:min(300px, 42vw); flex:none;
  background:repeating-linear-gradient(180deg,
    var(--gold) 0 5px, transparent 5px 13px);
  -webkit-mask-image:linear-gradient(90deg, #000 0%, #000 42%, transparent 100%);
          mask-image:linear-gradient(90deg, #000 0%, #000 42%, transparent 100%);
  opacity:.55;
}
.motif--flip{
  -webkit-mask-image:linear-gradient(270deg, #000 0%, #000 42%, transparent 100%);
          mask-image:linear-gradient(270deg, #000 0%, #000 42%, transparent 100%);
}

/* ---------- üst bar ---------- */
.site-head{
  position:sticky; top:0; z-index:100;
  background:color-mix(in srgb, var(--ink) 86%, transparent);
  backdrop-filter:saturate(140%) blur(14px);
  -webkit-backdrop-filter:saturate(140%) blur(14px);
  border-bottom:1px solid transparent;
  transition:border-color .3s, background .3s;
}
.site-head.is-stuck{ border-bottom-color:var(--line); background:color-mix(in srgb, var(--ink) 96%, transparent); }

.head-in{ display:flex; align-items:center; gap:1rem; min-height:74px; }
.brand{ flex:none; color:var(--gold); display:flex; align-items:center; }
.brand svg{ height:26px; width:auto; }

.nav{ display:none; margin-inline-start:auto; gap:2rem; }
.nav a{
  font-size:.82rem; letter-spacing:.13em; text-transform:uppercase; color:var(--bone-dim);
  padding-block:.4rem; position:relative; transition:color .25s;
}
.nav a::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:1px;
  background:var(--gold); transform:scaleX(0); transform-origin:left; transition:transform .3s;
}
.nav a:hover{ color:var(--bone); }
.nav a:hover::after,
.nav a[aria-current="page"]::after{ transform:scaleX(1); }
.nav a[aria-current="page"]{ color:var(--gold); }

.head-tel{ display:none; margin-inline-start:2.25rem; text-align:right; line-height:1.25; }
.head-tel-lbl{ display:block; font-size:.62rem; letter-spacing:.24em; text-transform:uppercase; color:var(--bone-dim); }
.head-tel-no{ display:block; font-size:.95rem; color:var(--gold); letter-spacing:.04em; }

.burger{
  margin-inline-start:auto; width:44px; height:44px; flex:none;
  background:none; border:0; padding:0; cursor:pointer;
  display:grid; place-content:center; gap:6px;
}
.burger span{ display:block; width:24px; height:1px; background:var(--bone); transition:transform .3s, opacity .3s; }
.burger[aria-expanded="true"] span:first-child{ transform:translateY(3.5px) rotate(45deg); }
.burger[aria-expanded="true"] span:last-child{ transform:translateY(-3.5px) rotate(-45deg); }

.mobil-menu{
  position:fixed; inset:74px 0 0; z-index:99;
  background:var(--ink); padding:var(--pad);
  padding-bottom:calc(var(--pad) + 54px + env(safe-area-inset-bottom, 0px));
  display:flex; flex-direction:column; gap:2rem;
  overflow-y:auto; overscroll-behavior:contain;
  animation:mmIn .28s ease both;
}
.mobil-menu[hidden]{ display:none; }   /* [hidden] tek başına .mobil-menu'yü ezemez */
@keyframes mmIn{ from{ opacity:0; transform:translateY(-8px); } }
.mobil-menu nav{ display:flex; flex-direction:column; }
.mobil-menu nav a{
  font-family:var(--serif); font-size:1.5rem; padding-block:1rem;
  border-bottom:1px solid var(--line-soft);
}
.mobil-menu nav a[aria-current="page"]{ color:var(--gold); }

.mm-alt{ margin-top:auto; display:flex; flex-direction:column; gap:.55rem; align-items:flex-start; }
.mm-amblem{ width:44px; color:var(--gold); opacity:.85; margin-bottom:.5rem; }
.mm-amblem svg{ width:100%; height:auto; }
.mm-tel{ font-family:var(--serif); font-size:1.35rem; color:var(--gold); letter-spacing:.03em; }
.mm-adres{ font-size:.86rem; color:var(--bone-dim); line-height:1.65; }
.mm-eposta{ font-size:.86rem; color:var(--bone-dim); border-bottom:1px solid var(--line); padding-bottom:.15rem; }

/* ---------- mobil sabit çağrı çubuğu ---------- */
.mobil-cta{
  position:fixed; left:0; right:0; bottom:0; z-index:95;
  display:grid; grid-template-columns:1fr 1fr;
  background:color-mix(in srgb, var(--ink) 90%, transparent);
  backdrop-filter:saturate(150%) blur(16px);
  -webkit-backdrop-filter:saturate(150%) blur(16px);
  border-top:1px solid var(--line);
  padding-bottom:env(safe-area-inset-bottom, 0);
}
.mobil-cta a{
  display:flex; align-items:center; justify-content:center;
  min-height:54px; font-size:.74rem; font-weight:400;
  letter-spacing:.2em; text-transform:uppercase;
  transition:background .3s, color .3s;
}
.mobil-cta a:first-child{ color:var(--ink); background:var(--gold); }
.mobil-cta a:first-child:active{ background:var(--gold-lit); }
.mobil-cta a:last-child{ color:var(--gold); border-inline-start:1px solid var(--line); }
.mobil-cta a:last-child:active{ background:var(--ink-2); }

/* ---------- düğmeler ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  min-height:52px; padding:0 1.6rem;
  font-family:var(--sans); font-size:.8rem; font-weight:400;
  letter-spacing:.18em; text-transform:uppercase;
  border:1px solid var(--gold); color:var(--gold); background:none;
  cursor:pointer; position:relative; overflow:hidden;
  transition:color .3s;
}
.btn::before{
  content:""; position:absolute; inset:0; background:var(--gold);
  transform:scaleY(0); transform-origin:bottom; transition:transform .32s cubic-bezier(.2,.7,.3,1); z-index:-1;
}
.btn{ isolation:isolate; }
.btn:hover{ color:var(--ink); }
.btn:hover::before{ transform:scaleY(1); }
.btn--solid{ background:var(--gold); color:var(--ink); }
.btn--solid::before{ background:var(--gold-lit); }
.btn--ghost{ border-color:var(--line); color:var(--bone); }
.btn--ghost::before{ background:var(--bone); }

.btn-row{ display:flex; flex-wrap:wrap; gap:.85rem; }

/* ---------- bölüm iskeleti ---------- */
.sec{ padding-block:var(--sec); }
.sec--tint{ background:var(--ink-2); }
.sec-head{ display:flex; flex-direction:column; gap:1rem; margin-bottom:clamp(2.5rem,6vw,4rem); }
.sec-head .lede{ margin-top:.4rem; }

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

/* ============================================================
   HERO
   ============================================================ */
.hero{ position:relative; overflow:hidden; padding-block:clamp(1.75rem,5vh,3.5rem) clamp(2.5rem,7vw,5rem); }
.hero h1{ max-width:15ch; }
.hero h1 em{ font-style:normal; color:var(--gold); }
.hero .lede{ max-width:52ch; }

.hero-meta{
  display:flex; flex-wrap:wrap; align-items:center; gap:.7rem 1.4rem;
  font-size:.74rem; letter-spacing:.2em; text-transform:uppercase; color:var(--bone-dim);
}
.hero-meta{ flex-direction:column; align-items:flex-start; gap:.5rem; }
.hero-meta span{ display:inline-flex; align-items:center; gap:.75rem; }
.hero-meta span::before{ content:""; width:16px; height:1px; background:var(--gold); opacity:.6; flex:none; }

/* ---------- güven şeridi ---------- */
.strip{ border-block:1px solid var(--line); background:var(--ink-2); }
.strip-in{ display:grid; gap:0; grid-template-columns:1fr; }
.strip-i{ padding:1.6rem 0; border-bottom:1px solid var(--line-soft); }
.strip-i:last-child{ border-bottom:0; }
.strip-i b{ display:block; font-family:var(--serif); font-size:1.55rem; font-weight:400; color:var(--gold); line-height:1.2; }
.strip-i span{ font-size:.76rem; letter-spacing:.18em; text-transform:uppercase; color:var(--bone-dim); }

/* ============================================================
   HİKÂYE (aile / köken)
   ============================================================ */
.story{ display:grid; gap:clamp(2.5rem,6vw,4.5rem); }
/* ana sayfa — çerçevesiz portre, siyah zemin sayfayla kaynaşır */
.story-portre{ margin-inline:auto; width:min(320px, 100%); }   /* mobilde ortalı */
.story-portre img{
  width:100%; height:auto;
  -webkit-mask-image:linear-gradient(180deg, #000 0%, #000 86%, transparent 100%);
          mask-image:linear-gradient(180deg, #000 0%, #000 86%, transparent 100%);
}

.story-body{ display:flex; flex-direction:column; gap:1.35rem; }
.pull{
  font-family:var(--serif); font-size:clamp(1.25rem,1.05rem + .8vw,1.6rem);
  line-height:1.5; color:var(--bone); border-inline-start:2px solid var(--gold);
  padding-inline-start:1.4rem; margin:.4rem 0;
}

/* ============================================================
   ÇALIŞMA ALANLARI
   ============================================================ */
.alan-grid{ display:grid; gap:1px; background:var(--line-soft); border:1px solid var(--line-soft); }
.alan{
  background:var(--ink); padding:clamp(1.4rem,4.5vw,2.2rem);
  display:flex; flex-direction:column; gap:.75rem;
  transition:background .35s;
}
.alan:hover{ background:var(--ink-3); }
.alan-no{ font-size:.7rem; letter-spacing:.22em; color:var(--gold-deep); }
.alan h3{ color:var(--bone); }
.alan p{ font-size:.94rem; color:var(--bone-dim); line-height:1.7; }
.alan--lead{ background:var(--ink-3); }
.alan--lead h3{ color:var(--gold); }

/* ============================================================
   BASINDA
   ============================================================ */
.basin-grid{ display:grid; gap:clamp(1.5rem,4vw,2.2rem); }
.kupur{
  display:flex; flex-direction:column; gap:0;
  border:1px solid var(--line-soft); background:var(--ink-2);
  transition:border-color .35s, transform .35s;
}
.kupur:hover{ border-color:var(--line); }
.kupur-img{
  position:relative; margin:0; overflow:hidden; background:#fff;
  aspect-ratio:1/1; cursor:zoom-in; border:0; padding:0; width:100%;
}
.kupur-img img{ width:100%; height:100%; object-fit:cover; object-position:top center; transition:transform .6s cubic-bezier(.2,.7,.3,1); }
.kupur:hover .kupur-img img{ transform:scale(1.035); }
.kupur-body{ padding:1.25rem clamp(1.1rem,3.5vw,1.6rem) 1.45rem; display:flex; flex-direction:column; gap:.6rem; }
.kupur-kaynak{ font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); }
.kupur h3{ font-size:1.1rem; line-height:1.35; }
.kupur p{ font-size:.9rem; color:var(--bone-dim); line-height:1.7; }

/* lightbox */
.lb{
  position:fixed; inset:0; z-index:150; display:none;
  background:rgba(6,5,5,.94); padding:clamp(1rem,4vw,3rem);
  place-items:center;
}
.lb[open]{ display:grid; }
.lb img{ max-width:100%; max-height:82vh; width:auto; object-fit:contain; }
@media (max-width:40em){ .lb{ padding:.75rem; } .lb img{ max-height:76vh; } }
.lb-close{
  position:absolute; top:clamp(.75rem,3vw,1.5rem); right:clamp(.75rem,3vw,1.5rem);
  width:48px; height:48px; border:1px solid var(--line); background:none; color:var(--bone);
  font-size:1.4rem; line-height:1; cursor:pointer;
}
.lb-cap{ margin-top:1rem; text-align:center; font-size:.85rem; color:var(--bone-dim); }

/* ============================================================
   ÖNE ÇIKAN ŞERİT (şehit & gazi yakınları)
   ============================================================ */
.vow{ background:var(--ink-2); border-block:1px solid var(--line); }
.vow-in{ display:flex; flex-direction:column; gap:1.5rem; align-items:flex-start; }
.vow h2{ font-size:clamp(1.5rem,1.2rem + 1.4vw,2.1rem); max-width:22ch; }
.vow p{ color:var(--bone-dim); max-width:58ch; }

/* ============================================================
   İLETİŞİM
   ============================================================ */
.ilet{ display:grid; gap:clamp(2.5rem,6vw,4rem); }
.ilet-liste{ display:flex; flex-direction:column; gap:1.9rem; }
.ilet-i{ display:flex; flex-direction:column; gap:.45rem; }
.ilet-i dt{ font-size:.7rem; letter-spacing:.22em; text-transform:uppercase; color:var(--gold); }
.ilet-i dd{ margin:0; font-size:1.05rem; line-height:1.6; }
.ilet-i dd a:hover{ color:var(--gold); }
.harita{ border:1px solid var(--line); aspect-ratio:4/3; width:100%; background:var(--ink-2); filter:grayscale(1) contrast(.9) brightness(.85); transition:filter .5s; }
.harita:hover{ filter:grayscale(.3) contrast(1) brightness(1); }

/* ---- iletişim sayfası ---- */
.ilet-strip .strip-i{ display:flex; flex-direction:column; align-items:flex-start; gap:.45rem; }
.ilet-strip .strip-i span{ order:-1; }
.ilet-strip .strip-i b{ font-size:1.18rem; }
.ilet-strip .strip-i b a:hover{ color:var(--gold-lit); }
.ilet-strip .strip-i p{ font-size:.9rem; color:var(--bone-dim); line-height:1.65; }
.ilet-strip .strip-i p a:hover{ color:var(--gold); }

.ilet-alt{ display:grid; gap:clamp(2rem,5vw,3rem); align-items:stretch; }

.harita-kutu{ display:flex; flex-direction:column; min-height:0; }
.harita-kutu .harita{ flex:1 1 auto; aspect-ratio:4/3; min-height:340px; border-bottom:0; }

.form-kutu{
  border:1px solid var(--line); background:var(--ink-2);
  padding:clamp(1.5rem,4vw,2.4rem);
  display:flex; flex-direction:column; gap:1rem;
}
.form-kutu h2{ font-size:clamp(1.35rem,1.15rem + .8vw,1.75rem); }
.form-giris{ font-size:.94rem; line-height:1.7; max-width:46ch; margin-bottom:.5rem; }
.form-kutu .f-i input, .form-kutu .f-i textarea{ background:var(--ink); }
.form-kutu .f-i input:focus, .form-kutu .f-i textarea:focus{ background:var(--ink-3); }
.harita-yol{
  display:flex; align-items:center; justify-content:space-between;
  border:1px solid var(--line); border-top:0; padding:.95rem 1.1rem;
  font-size:.74rem; letter-spacing:.18em; text-transform:uppercase; color:var(--gold);
  background:var(--ink-2); transition:background .3s, color .3s;
}
.harita-yol::after{ content:"↗"; font-size:1rem; letter-spacing:0; }
.harita-yol:hover{ background:var(--gold); color:var(--ink); }

.form{ display:flex; flex-direction:column; gap:1.1rem; }
.f-row{ display:grid; gap:1.1rem; }
.f-i{ display:flex; flex-direction:column; gap:.5rem; }
.f-i label{ font-size:.7rem; letter-spacing:.2em; text-transform:uppercase; color:var(--bone-dim); }
.f-i input, .f-i textarea{
  font-family:var(--sans); font-size:1rem; font-weight:300; color:var(--bone);
  background:var(--ink-2); border:1px solid var(--line-soft); border-radius:0;
  padding:.95rem 1rem; min-height:52px; transition:border-color .25s, background .25s;
}
.f-i textarea{ resize:vertical; min-height:140px; line-height:1.7; }
.f-i input:focus, .f-i textarea:focus{ border-color:var(--gold); background:var(--ink-3); outline:none; }
.f-not{ font-size:.8rem; color:var(--bone-dim); line-height:1.65; }

/* ============================================================
   FOOTER
   ============================================================ */
.site-foot{ border-top:1px solid var(--line); background:var(--ink-2); padding-block:clamp(3rem,7vw,4.5rem) 2rem; }
.foot-top{ display:grid; gap:2.5rem; }
.foot-brand{ display:flex; flex-direction:column; gap:1.1rem; align-items:flex-start; }
.foot-brand svg{ height:30px; width:auto; color:var(--gold); }
.foot-brand p{ font-size:.88rem; color:var(--bone-dim); max-width:34ch; line-height:1.7; }
.foot-col h4{ font-family:var(--sans); font-size:.7rem; font-weight:400; letter-spacing:.22em; text-transform:uppercase; color:var(--gold); margin-bottom:1rem; }
.foot-col ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.65rem; }
.foot-col a, .foot-col li{ font-size:.92rem; color:var(--bone-dim); line-height:1.6; }
.foot-col a:hover{ color:var(--bone); }

.foot-bot{
  margin-top:clamp(2.5rem,6vw,3.5rem); padding-top:1.75rem; border-top:1px solid var(--line-soft);
  display:flex; flex-direction:column; gap:1rem; font-size:.78rem; color:var(--bone-dim);
}
.foot-bot a:hover{ color:var(--gold); }
.imza{ display:inline-flex; align-items:center; gap:.4rem; letter-spacing:.04em; }
.imza b{ font-weight:400; color:var(--bone); }

/* ---------- giriş animasyonu ---------- */
.rv{ opacity:1; transform:none; }   /* JS yoksa içerik görünür kalır */
.js .rv{ opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.3,1); }
.js .rv.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  .js .rv{ opacity:1; transform:none; transition:none; }
  .mobil-menu{ animation:none; }
  .kupur-img img{ transition:none; }
}

/* ============================================================
   HERO LOGOSU (kurumsal postun birebir kullanımı)
   ============================================================ */
.hero-in{ display:grid; gap:clamp(2rem,6vw,4rem); }
.hero-logo{ color:var(--gold); display:flex; justify-content:center; }   /* mobil: görsel öğe ortalı */
.hero-logo svg{ width:min(216px, 54vw); height:auto; }
.hero-metin{ display:flex; flex-direction:column; gap:clamp(1.1rem,2.4vh,1.9rem); align-items:flex-start; }

/* ============================================================
   SAYFA BAŞLIĞI
   ============================================================ */
.phero{ padding-block:clamp(3rem,9vw,5.5rem) clamp(2.5rem,7vw,4rem); }
.phero h1{ max-width:18ch; margin-block:.9rem .6rem; }
.phero .lede{ margin-top:.4rem; }
.phero--not h1{ max-width:24ch; }

/* ============================================================
   HAKKIMIZDA — özgeçmiş + portre, künye şeridi
   ============================================================ */
.ozgecmis{ display:grid; gap:clamp(2.25rem,5vw,3.5rem); align-items:start; }
.ozgecmis-foto{ order:-1; width:min(300px, 78%); margin-inline:auto; }   /* mobilde önce ve ortalı */
.ozgecmis-metin{ order:0; }
.ozgecmis-metin{ display:flex; flex-direction:column; gap:1.4rem; max-width:64ch; }
.ozgecmis-metin p{ line-height:1.85; }

/* portrenin zemini sayfayla aynı siyah — çerçeve yok, kenarlar yumuşak biter */
.ozgecmis-foto{ align-self:start; }
.ozgecmis-foto img{
  width:100%; height:auto;
  -webkit-mask-image:linear-gradient(180deg, #000 0%, #000 82%, transparent 100%);
          mask-image:linear-gradient(180deg, #000 0%, #000 82%, transparent 100%);
}

.kunye-bas{
  font-family:var(--sans); font-size:.72rem; font-weight:400; letter-spacing:.22em;
  text-transform:uppercase; color:var(--gold); margin-bottom:1.75rem;
}
.kunye-grid{ margin:0; display:grid; gap:1px; background:var(--line-soft); border:1px solid var(--line-soft); }
.kunye-grid > div{
  background:var(--ink-2); padding:1.15rem clamp(1rem,3vw,1.4rem);
  display:flex; flex-direction:column; gap:.3rem;
}
.kunye-grid dt{ font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; color:var(--bone-dim); }
.kunye-grid dd{ margin:0; font-size:.98rem; color:var(--bone); line-height:1.45; }
.kunye-grid dd a:hover{ color:var(--gold); }

/* ============================================================
   ÇALIŞMA ALANLARI — detay
   ============================================================ */
.alan-detay{ display:flex; flex-direction:column; gap:0; }
.ad-blok{ display:grid; gap:1.5rem; padding-block:clamp(2.2rem,5vw,3rem); border-top:1px solid var(--line-soft); scroll-margin-top:90px; }
.ad-blok:first-child{ border-top:0; }
.ad-bas{ display:flex; flex-direction:column; gap:.6rem; }
.ad-bas h2{ font-size:clamp(1.45rem,1.2rem + 1.1vw,2rem); }
.ad-blok--lead .ad-bas h2{ color:var(--gold); }
.ad-bas p{ font-size:.95rem; max-width:48ch; }
.ad-liste{ list-style:none; margin:0; padding:0; display:grid; gap:.75rem 1.5rem; }
.ad-liste li{ position:relative; padding-inline-start:1.35rem; font-size:.95rem; color:var(--bone-dim); line-height:1.6; }
.ad-liste li::before{
  content:""; position:absolute; left:0; top:.68em;
  width:6px; height:6px; border:1px solid var(--gold); transform:rotate(45deg);
}

/* ============================================================
   BASINDA — tam liste (kare kart ızgarası)
   ============================================================ */
.basin-grid--tum .kupur-body h2{ font-size:1.06rem; line-height:1.4; }
.basin-grid--tum .kupur-body p{
  font-size:.9rem; color:var(--bone-dim); line-height:1.7;
  display:-webkit-box; -webkit-line-clamp:5; -webkit-box-orient:vertical; overflow:hidden;
}
.basin-grid--tum .bl-meta{ margin-bottom:.15rem; }
.bl-zoom{
  position:absolute; inset-inline-end:.6rem; inset-block-end:.6rem;
  background:var(--ink); color:var(--gold); font-size:.66rem; letter-spacing:.18em;
  text-transform:uppercase; padding:.45rem .8rem; border:1px solid var(--gold);
}
.bl-meta{ display:flex; flex-wrap:wrap; align-items:center; gap:.5rem 1rem; font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; }
.bl-alan{ border:1px solid var(--line); color:var(--bone-dim); padding:.3rem .65rem; letter-spacing:.12em; }
.basin-not{
  margin-top:clamp(2.5rem,6vw,3.5rem); padding-top:1.75rem; border-top:1px solid var(--line-soft);
  font-size:.84rem; color:var(--bone-dim); max-width:70ch; line-height:1.7;
}
.harita--genis{ aspect-ratio:16/9; border-inline:0; }

/* ---------- mobilde küpürler: kompakt yatay kart ---------- */
@media (max-width:40em){
  .basin-grid{ gap:1rem; }
  .kupur{ display:grid; grid-template-columns:104px 1fr; align-items:stretch; }
  .kupur-img{ aspect-ratio:auto; height:100%; }
  .kupur-img img{ object-position:top center; }
  .kupur-body{
    padding:.85rem .95rem; gap:.3rem; justify-content:center;
    border-inline-start:1px solid var(--line-soft);
  }
  .kupur-kaynak{ font-size:.6rem; letter-spacing:.16em; }
  .kupur h3,
  .basin-grid--tum .kupur-body h2{
    font-size:.95rem; line-height:1.35;
    display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
  }
  .kupur-body p,
  .basin-grid--tum .kupur-body p{ display:none; }
  .basin-grid--tum .bl-meta{ gap:.3rem .6rem; margin-bottom:0; }
  .bl-alan{ display:none; }
  .bl-zoom{ inset-inline-end:.35rem; inset-block-end:.35rem; padding:.28rem .5rem; font-size:.56rem; letter-spacing:.12em; }
}

/* ============================================================
   HUKUK NOTLARI
   ============================================================ */
.filtre{ display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:clamp(2rem,5vw,3rem); }
.filtre-b{
  font-family:var(--sans); font-size:.74rem; font-weight:300; letter-spacing:.14em; text-transform:uppercase;
  color:var(--bone-dim); background:none; border:1px solid var(--line-soft);
  padding:.6rem 1rem; cursor:pointer; transition:color .25s, border-color .25s, background .25s;
}
.filtre-b:hover{ color:var(--bone); border-color:var(--line); }
.filtre-b.is-on{ color:var(--ink); background:var(--gold); border-color:var(--gold); }

.not-grid{ display:grid; gap:1px; background:var(--line-soft); border:1px solid var(--line-soft); }
.not{
  background:var(--ink); padding:clamp(1.6rem,4vw,2.1rem);
  display:flex; flex-direction:column; gap:1rem;
  transition:background .35s;
}
.notlar-sec .not, .sec--tint .not{ background:var(--ink-2); }
.not:hover{ background:var(--ink-3); }
.not[hidden]{ display:none; }
.not-tip{
  align-self:flex-start; font-size:.62rem; letter-spacing:.2em; text-transform:uppercase;
  padding:.35rem .7rem; border:1px solid var(--line);
}
.not-tip--karar{ color:var(--gold); border-color:var(--gold-deep); }
.not-tip--mevzuat{ color:var(--bone-dim); }
.not-hukum{
  font-family:var(--serif); font-size:clamp(1.08rem,1rem + .4vw,1.28rem);
  line-height:1.45; color:var(--bone); flex:1;
}
.not-alt{ display:flex; flex-direction:column; gap:.15rem; padding-top:1rem; border-top:1px solid var(--line-soft); }
.not-kaynak{ font-size:.82rem; color:var(--gold); }
.not-kunye{ font-size:.78rem; color:var(--bone-dim); font-variant-numeric:tabular-nums; }
.not-alan{ font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; color:var(--bone-dim); }

/* not detayı */
.kirinti{ display:flex; flex-wrap:wrap; gap:.5rem; font-size:.76rem; letter-spacing:.1em; color:var(--bone-dim); margin-bottom:1.5rem; }
.kirinti a:hover{ color:var(--gold); }
.not-h1{ font-size:clamp(1.6rem,1.2rem + 2.4vw,2.85rem); line-height:1.25; margin-block:1.1rem 1.75rem; }
.not-kunye-blok{ display:flex; flex-direction:column; gap:1rem; }
.not-kunye-blok p{ font-size:.95rem; line-height:1.6; }
.not-kunye-blok strong{ font-weight:400; color:var(--gold); }
.not-metin{ max-width:66ch; font-size:clamp(1.02rem,.98rem + .25vw,1.12rem); line-height:1.85; }
.not-cta{
  margin-top:clamp(3rem,7vw,4.5rem); padding:clamp(1.75rem,5vw,2.5rem);
  border:1px solid var(--line); background:var(--ink-2);
  display:flex; flex-direction:column; gap:1.5rem;
}
.not-cta h2{ font-size:clamp(1.3rem,1.15rem + .7vw,1.65rem); margin-bottom:.5rem; }

/* ============================================================
   ≥ 640px
   ============================================================ */
@media (min-width:40em){
  .strip-in{ grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-soft); }
  .strip-i{ background:var(--ink-2); border-bottom:0; padding:2rem clamp(1rem,3vw,1.75rem); }
  .alan-grid{ grid-template-columns:repeat(2,1fr); }
  .basin-grid{ grid-template-columns:repeat(2,1fr); }
  .f-row{ grid-template-columns:1fr 1fr; }
  .foot-top{ grid-template-columns:repeat(2,1fr); }
  .foot-bot{ flex-direction:row; justify-content:space-between; align-items:center; }
  .vow-in{ flex-direction:row; align-items:center; justify-content:space-between; gap:3rem; }
  .vow-in .btn{ flex:none; }

  .ilke-grid{ grid-template-columns:repeat(2,1fr); }
  .kunye-grid{ grid-template-columns:repeat(2,1fr); }
  .ad-liste{ grid-template-columns:repeat(2,1fr); }
  .not-grid{ grid-template-columns:repeat(2,1fr); }
  .not-cta{ flex-direction:row; align-items:center; justify-content:space-between; gap:2.5rem; }
  .not-cta .btn-row{ flex:none; }
  .not-kunye-blok{ flex-direction:row; align-items:center; gap:1.75rem; }
}

/* ============================================================
   ≥ 900px
   ============================================================ */
@media (min-width:56.25em){
  .nav{ display:flex; }
  .head-tel{ display:block; }
  .burger{ display:none; }
  .mobil-cta{ display:none; }
  body{ padding-bottom:0; }
  .brand svg{ height:30px; }

  .hero{ padding-block:clamp(2.5rem,7vh,6rem) clamp(3.5rem,8vw,6rem); }

  .hero-in{ grid-template-columns:1.2fr .8fr; align-items:center; gap:clamp(3rem,6vw,5rem); }
  .hero-metin{ order:1; }
  .hero-logo{ order:2; justify-content:flex-end; }
  .hero-logo svg{ width:min(340px, 28vw); }

  .story{ grid-template-columns:auto 1fr; align-items:center; gap:clamp(2.5rem,5vw,4rem); }
  .story-portre{ margin-inline:0; }
  .alan-grid{ grid-template-columns:repeat(3,1fr); }
  .basin-grid{ grid-template-columns:repeat(3,1fr); }
  .ilet{ grid-template-columns:1fr 1.15fr; align-items:start; }
  .ilet-alt{ grid-template-columns:1.08fr 1fr; }
  .harita-kutu .harita{ aspect-ratio:auto; min-height:460px; }
  .foot-top{ grid-template-columns:1.4fr 1fr 1fr; gap:3rem; }

  .ozgecmis{ grid-template-columns:1fr .62fr; gap:clamp(2.5rem,5vw,4rem); }
  .ozgecmis-foto{ order:0; width:100%; margin-inline:0; }
  .kunye-grid{ grid-template-columns:repeat(4,1fr); }
  .ilke-grid{ grid-template-columns:repeat(4,1fr); }
  .ad-blok{ grid-template-columns:.9fr 1.1fr; gap:3rem; }
  .not-grid{ grid-template-columns:repeat(3,1fr); }
}