/* ===========================================================
   Fzt. Hasan Hüseyin Ördek — Fizik Tedavi ve Klinik Pilates
   Tasarım: koyu zemin, büyük tipografi, kaydırmaya bağlı hareket
   =========================================================== */

:root{
  /* Zemin — kartvizitteki lacivert/mavi ailesi */
  --siyah:      #0A2247;   /* en koyu lacivert (eski adı korundu) */
  --koyu:       #0F2E5F;
  --koyu-2:     #16406F;
  --beyaz:      #FFFFFF;
  --kagit:      #EAF4FB;   /* buz mavisi */
  --kagit-2:    #D6E9F7;
  --kagit-cizgi: rgba(15,46,95,.18);   /* buz mavisi bölümlerin üst sınırı */

  /* Metin */
  --metin:          #12283F;
  --metin-2:        #4F6780;   /* beyaz 5.86, buz 5.25, krem 5.12 kontrast */
  --metin-ters:     #FFFFFF;
  --metin-ters-2:   rgba(232,242,252,.70);

  /* Vurgu */
  /* Küçük yazı ve buton zemini için: beyazda 5.74, buzda 5.14 kontrast.
     Kartvizitin #1B84C7 mavisi bu boyutlarda eşiğin altında kalıyordu. */
  --mavi:        #146BA3;
  --mavi-parlak: #1B84C7;   /* dekoratif, büyük öğeler */
  --mavi-acik:   #5EB6E8;   /* koyu zemin üstü */
  --mavi-solgun:#9CCBFF;
  --whatsapp:   #25D366;

  --cizgi:      rgba(15,46,95,.13);
  --cizgi-ters: rgba(255,255,255,.16);

  /* Apple'ın kullandığı yumuşak çıkış eğrisi */
  --egri: cubic-bezier(.16,1,.3,1);
  --egri-yumusak: cubic-bezier(.4,0,.2,1);

  --wrap: 1240px;
  --dar: 900px;
  --kenar: 28px;
  --bar-h: 62px;
}

/* ---------- Temel ---------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:80px; }
body{
  margin:0;
  background:var(--beyaz);
  color:var(--metin);
  font-family:'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  font-size:17px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; cursor:pointer; }
ul{ margin:0; padding:0; list-style:none; }
p{ margin:0 0 1em; }

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

::selection{ background:var(--mavi); color:#fff; }
:focus-visible{ outline:2px solid var(--mavi-acik); outline-offset:4px; border-radius:6px; }

.gizle-gorsel{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.atla{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--siyah); color:#fff; padding:14px 22px; border-radius:0 0 10px 0;
}
.atla:focus{ left:0; }

/* ---------- Tipografi ölçeği ---------- */
.dev{
  font-size:clamp(3rem, 9.5vw, 8rem);
  line-height:.92; font-weight:800; letter-spacing:-.045em; margin:0;
}
.buyuk{
  font-size:clamp(2.1rem, 5.2vw, 4rem);
  line-height:1.03; font-weight:800; letter-spacing:-.038em; margin:0 0 .4em;
}
.orta{
  font-size:clamp(1.5rem, 2.9vw, 2.3rem);
  line-height:1.15; font-weight:700; letter-spacing:-.028em; margin:0 0 .5em;
}
.etiket{
  font-size:.74rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  color:var(--mavi); margin:0 0 20px; display:block;
}
.etiket.ters{ color:var(--mavi-acik); }
.giris{ font-size:clamp(1.05rem,1.5vw,1.28rem); color:var(--metin-2); max-width:56ch; }
.giris.ters{ color:var(--metin-ters-2); }

/* ---------- Butonlar ---------- */
.dugme{
  --dg-bg:var(--mavi); --dg-fg:#fff; --dg-cizgi:transparent;
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:15px 30px; border-radius:100px; border:1px solid var(--dg-cizgi);
  background:var(--dg-bg); color:var(--dg-fg);
  font-size:1rem; font-weight:600; letter-spacing:-.01em;
  transition:transform .4s var(--egri), background .3s var(--egri-yumusak),
             color .3s var(--egri-yumusak), border-color .3s var(--egri-yumusak);
  will-change:transform;
}
.dugme:hover{ transform:scale(1.045); }
.dugme:active{ transform:scale(.985); }
.dugme svg{ width:18px; height:18px; flex:none; }

.dugme.hayalet{ --dg-bg:transparent; --dg-fg:var(--metin); --dg-cizgi:var(--cizgi); }
.dugme.hayalet:hover{ --dg-bg:var(--metin); --dg-fg:#fff; --dg-cizgi:var(--metin); }
.dugme.cam{ --dg-bg:rgba(255,255,255,.12); --dg-fg:#fff; --dg-cizgi:rgba(255,255,255,.26); backdrop-filter:blur(12px); }
.dugme.cam:hover{ --dg-bg:rgba(255,255,255,.22); }
.dugme.wa{ --dg-bg:var(--whatsapp); --dg-fg:#06331A; }
.dugme.wa:hover{ --dg-bg:#2ee273; }
.dugme.kucuk{ padding:11px 22px; font-size:.92rem; }

.dugmeler{ display:flex; flex-wrap:wrap; gap:12px; }

/* Alt çizgili metin bağlantısı */
.metin-link{
  display:inline-flex; align-items:center; gap:7px;
  font-weight:600; color:var(--mavi);
  transition:gap .35s var(--egri);
}
.metin-link svg{ width:15px; height:15px; transition:transform .35s var(--egri); }
.metin-link:hover{ gap:11px; }
.metin-link:hover svg{ transform:translateX(2px); }

/* ===========================================================
   ÜST BAR
   =========================================================== */
.bar{
  position:fixed; inset:0 0 auto 0; z-index:100; height:var(--bar-h);
  display:flex; align-items:center;
  background:rgba(255,255,255,0); border-bottom:1px solid transparent;
  transition:background .45s var(--egri-yumusak), border-color .45s var(--egri-yumusak),
             backdrop-filter .45s var(--egri-yumusak), transform .45s var(--egri);
}
.bar-ic{ display:flex; align-items:center; justify-content:space-between; gap:24px; width:100%;
         max-width:var(--wrap); margin-inline:auto; padding-inline:var(--kenar); }

/* Koyu bölüm üzerindeyken beyaz yazı */
.bar.ters{ color:#fff; }
.bar.dolu{
  background:rgba(255,255,255,.72);
  backdrop-filter:saturate(180%) blur(20px); -webkit-backdrop-filter:saturate(180%) blur(20px);
  border-bottom-color:var(--cizgi);
  color:var(--metin);
}
.bar.gizli{ transform:translateY(-100%); }

.marka{ display:flex; flex-direction:column; line-height:1.2; letter-spacing:-.02em; }
.marka b{ font-size:.98rem; font-weight:700; }
.marka span{ font-size:.68rem; opacity:.58; font-weight:500; letter-spacing:.02em; }

.menu{ display:flex; align-items:center; gap:4px; }
.menu > a{
  position:relative; padding:8px 14px; font-size:.9rem; font-weight:500; opacity:.72;
  transition:opacity .3s var(--egri-yumusak);
}
.menu > a:hover, .menu > a[aria-current="page"]{ opacity:1; }
.menu > a[aria-current="page"]::after{
  content:''; position:absolute; left:14px; right:14px; bottom:2px; height:1.5px;
  background:currentColor; border-radius:2px;
}
/* Alt sayfanın en üstünde bar koyu zeminin üzerindeyken aktif sayfa çizgisi beyazdır. */
.bar.ters:not(.dolu) .menu > a[aria-current="page"]::after{ background:#fff; }
.menu-cta{ margin-left:10px; }

.menu-ac{
  display:none; width:42px; height:42px; border:0; background:transparent;
  border-radius:10px; position:relative;
}
.menu-ac i{
  position:absolute; left:11px; width:20px; height:1.8px; background:currentColor;
  border-radius:2px; transition:transform .4s var(--egri), opacity .25s;
}
.menu-ac i:nth-child(1){ top:16px; }
.menu-ac i:nth-child(2){ top:23px; }
.menu-ac[aria-expanded="true"] i:nth-child(1){ transform:translateY(3.5px) rotate(45deg); }
.menu-ac[aria-expanded="true"] i:nth-child(2){ transform:translateY(-3.5px) rotate(-45deg); }

/* Tam ekran mobil menü */
.menu-perde{
  position:fixed; inset:0; z-index:99; background:rgba(10,34,71,.97);
  backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
  display:flex; flex-direction:column; justify-content:center; gap:6px;
  padding:var(--bar-h) 32px 40px; color:#fff;
  opacity:0; visibility:hidden; transition:opacity .45s var(--egri), visibility .45s;
}
.menu-perde.acik{ opacity:1; visibility:visible; }
.menu-perde a{
  font-size:clamp(1.8rem,7vw,2.6rem); font-weight:700; letter-spacing:-.035em;
  padding:10px 0; border-bottom:1px solid rgba(255,255,255,.1);
  opacity:0; transform:translateY(24px);
  transition:opacity .5s var(--egri), transform .5s var(--egri);
}
.menu-perde.acik a{ opacity:1; transform:none; }
.menu-perde.acik a:nth-child(1){ transition-delay:.06s }
.menu-perde.acik a:nth-child(2){ transition-delay:.10s }
.menu-perde.acik a:nth-child(3){ transition-delay:.14s }
.menu-perde.acik a:nth-child(4){ transition-delay:.18s }
.menu-perde.acik a:nth-child(5){ transition-delay:.22s }
.menu-perde.acik a:nth-child(6){ transition-delay:.26s }
.menu-perde.acik a:nth-child(7){ transition-delay:.30s }
.menu-perde .perde-alt{
  margin-top:28px; display:flex; flex-direction:column; gap:6px;
  font-size:.95rem; color:rgba(255,255,255,.6); border:0;
}

/* ===========================================================
   KAHRAMAN BÖLÜM
   =========================================================== */
.kahraman{
  position:relative; min-height:100svh; background:var(--siyah); color:#fff;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:calc(var(--bar-h) + 40px) 0 44px; overflow:hidden; isolation:isolate;
}
.kahraman-fon{ position:absolute; inset:0; z-index:-2; overflow:hidden; }
.kahraman-fon img{
  width:100%; height:100%; object-fit:cover; object-position:60% 42%;
  transform:scale(1.12); opacity:0;
  animation:fonAc 2.4s var(--egri) .15s forwards;
}
@keyframes fonAc{ to{ transform:scale(1); opacity:1; } }
.kahraman-fon::after{
  content:''; position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(10,34,71,.74) 0%, rgba(10,34,71,.26) 34%, rgba(10,34,71,.55) 68%, rgba(8,28,58,.95) 100%),
    radial-gradient(120% 80% at 20% 90%, rgba(10,34,71,.68), transparent 60%);
}

.kahraman-ic{ position:relative; }
.kahraman h1{
  margin:0 0 26px;
  transform:translateY(clamp(-18px,-1.2vw,-10px));
}
.kahraman h1 .sat{
  display:block; overflow:visible;
}
.kahraman h1 .sat:last-child{
  /* Son satırdaki ş harfinin alt uzantısı kesilmesin ve alttaki metne taşmasın. */
  padding-bottom:.16em;
}
.kahraman h1 .sat > span{
  display:block; opacity:0; transform:translateY(.45em);
  animation:satirKalk 1.15s var(--egri) forwards;
}
.kahraman h1 .sat:nth-child(1) > span{ animation-delay:.35s; }
.kahraman h1 .sat:nth-child(2) > span{ animation-delay:.47s; }
@keyframes satirKalk{ to{ opacity:1; transform:translateY(0); } }
.kahraman h1 em{ font-style:normal; color:var(--mavi-acik); }

.kahraman-alt{
  display:flex; align-items:flex-end; justify-content:space-between; gap:40px; flex-wrap:wrap;
  opacity:0; transform:translateY(28px);
  animation:yumusakGir 1s var(--egri) .78s forwards;
}
@keyframes yumusakGir{ to{ opacity:1; transform:none; } }
.kahraman-alt .giris{ max-width:44ch; margin:0; }

/* ===========================================================
   BÖLÜM ORTAKLARI
   =========================================================== */
.bolum{ padding:clamp(88px,13vw,168px) 0; position:relative; }
.bolum.dar-ust{ padding-top:clamp(56px,8vw,96px); }
.bolum.kagit{ background:var(--kagit); }
.bolum.gece{ background:linear-gradient(168deg, var(--koyu) 0%, var(--siyah) 62%); color:#fff; }
/* Kapanış buz mavisi: üstteki beyaz bölümden ince çizgiyle, alttaki lacivert
   alt bilgiden renk zıtlığıyla ayrılır. Önceden kapanış da alt bilgi de
   lacivertti ve ikisi tek bir blok gibi görünüyordu. */
.bolum.kagit.kapanis{ border-top:1px solid var(--kagit-cizgi); }
.bolum.gece .orta,.bolum.gece .buyuk{ color:#fff; }

.bolum-bas{ max-width:24ch; margin-bottom:clamp(40px,6vw,72px); }
.bolum-bas.genis{ max-width:34ch; }

/* ===========================================================
   MANİFESTO — kaydırdıkça aydınlanan metin
   =========================================================== */
.manifesto{ padding:clamp(96px,16vw,200px) 0; background:var(--beyaz); }
.manifesto p{
  font-size:clamp(1.6rem,4.2vw,3.1rem); line-height:1.22; font-weight:700;
  letter-spacing:-.035em; margin:0; max-width:20ch;
}
.manifesto .kelime{
  color:var(--kagit-2);
  transition:color .5s var(--egri-yumusak);
}
.manifesto .kelime.yanik{ color:var(--metin); }
.manifesto .imza{
  margin-top:44px; font-size:.95rem; font-weight:600; color:var(--metin-2);
  letter-spacing:-.01em;
}

/* ===========================================================
   HAKKINDA — yapışkan görsel
   =========================================================== */
.hakkinda-izgara{
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
  gap:clamp(36px,6vw,88px); align-items:start;
}
/* Görsel sabit dursun: ne yapışkan ne paralaks — metinle birlikte akar.
   align-self:center: yazı sütunu daha uzun olduğu için fotoğraf ona göre
   dikeyde ortalanır; yalnızca fotoğraf ortalanır, yazı üstte kalır. */
.hakkinda-gorsel{ position:static; align-self:center; }
.cerceve{
  position:relative; border-radius:26px; overflow:hidden; background:var(--kagit-2);
  box-shadow:0 30px 80px -30px rgba(10,34,71,.42);
}
.cerceve img{ width:100%; aspect-ratio:4/5; object-fit:cover; }
.cerceve.genis img{ aspect-ratio:16/10; }
.cerceve.uzun img{ aspect-ratio:3/4; }

/* Parallax: görsel kabından biraz büyük, kaydırdıkça kayar */
.paralaks{ overflow:hidden; }
.paralaks img{
  transform:translate3d(0, calc(var(--px,0) * 1px), 0) scale(1.20);   /* pay: %10 > paralaks %8 */
  will-change:transform;
}

.olcut-sirasi{ display:grid; gap:0; margin-top:44px; border-top:1px solid var(--cizgi); }
.olcut{ display:flex; align-items:baseline; gap:18px; padding:20px 0; border-bottom:1px solid var(--cizgi); }
.olcut b{ font-size:clamp(1.6rem,3vw,2.2rem); font-weight:800; letter-spacing:-.04em; line-height:1; min-width:2.6em; }
.olcut span{ font-size:.95rem; color:var(--metin-2); }
.gece .olcut{ border-color:var(--cizgi-ters); }
.gece .olcut-sirasi{ border-color:var(--cizgi-ters); }
.gece .olcut span{ color:var(--metin-ters-2); }

/* ===========================================================
   HİZMETLER — yatay kaydırmalı ray
   =========================================================== */
.ray-bas{ display:flex; align-items:flex-end; justify-content:space-between; gap:28px; margin-bottom:36px; }
.ray-oklar{ display:flex; gap:10px; }
.ok{
  width:44px; height:44px; border-radius:50%; border:1px solid var(--cizgi);
  background:transparent; display:grid; place-items:center;
  transition:background .3s var(--egri-yumusak), border-color .3s, opacity .3s, transform .35s var(--egri);
}
.ok svg{ width:17px; height:17px; }
.ok:hover:not(:disabled){ background:var(--metin); color:#fff; border-color:var(--metin); }
.ok:active:not(:disabled){ transform:scale(.92); }
.ok:disabled{ opacity:.28; cursor:default; }
.gece .ok{ border-color:var(--cizgi-ters); }
.gece .ok:hover:not(:disabled){ background:#fff; color:var(--siyah); border-color:#fff; }

.ray{
  display:grid; grid-auto-flow:column; grid-auto-columns:minmax(330px,33%);
  gap:20px; overflow-x:auto; overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory; scroll-padding-left:var(--kenar);
  /* overflow-x:auto, overflow-y'yi de auto yapar; hover'da 6px kalkan kart
     ve gölgesi kırpılmasın diye içeriden pay verilip dışarıdan geri alınıyor. */
  padding-block:14px 26px; margin-block:-14px -26px;
  scrollbar-width:none; -ms-overflow-style:none;
  /* Kenarlardan taşsın, sayfa payını kendisi versin */
  margin-inline:calc(var(--kenar) * -1);
  padding-inline:var(--kenar);
}
.ray::-webkit-scrollbar{ display:none; }
.ray > *{ scroll-snap-align:start; }
.ray.suruklenirken{ cursor:grabbing; scroll-snap-type:none; }
.ray.suruklenirken *{ pointer-events:none; }

.hizmet{
  background:var(--beyaz); border-radius:22px; padding:32px 30px 34px;
  display:flex; flex-direction:column; min-height:300px;
  border:1px solid var(--cizgi);
  transition:transform .55s var(--egri), box-shadow .55s var(--egri);
}
.kagit .hizmet{ background:var(--beyaz); border-color:transparent; }
.hizmet:hover{ transform:translateY(-6px); box-shadow:0 26px 60px -26px rgba(15,46,95,.30); }
/* İçerik yukarıdan aşağıya aksın: önceden margin-bottom:auto ile dibe
   itiliyordu, metin uzunluğuna göre boşluk 28-53px arasında değişip
   başlıklar kartlar arasında hizasız kalıyordu. */
.hizmet-no{
  font-size:.76rem; font-weight:700; letter-spacing:.14em; color:var(--mavi);
  margin:0 0 16px;
}
.hizmet h3{ font-size:1.32rem; font-weight:700; letter-spacing:-.028em; margin:0 0 10px; line-height:1.2; }
.hizmet p{ font-size:.96rem; color:var(--metin-2); margin:0; line-height:1.62; }

/* ===========================================================
   PİLATES — koyu, tam genişlik görsel
   =========================================================== */
.genis-gorsel{
  position:relative; height:clamp(380px,72vh,720px); overflow:hidden;
  margin-block:clamp(48px,7vw,90px);
}
.genis-gorsel img{
  width:100%; height:100%; object-fit:cover;
  transform:translate3d(0, calc(var(--px,0) * 1px), 0) scale(1.24);   /* pay: %12 > paralaks %10 */
  will-change:transform;
}
.genis-gorsel::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(10,34,71,.55), rgba(10,34,71,.10) 40%, rgba(10,34,71,.62));
}
.genis-gorsel .uzeri{
  position:absolute; inset:auto 0 0 0; padding:0 0 clamp(28px,5vw,54px);
  z-index:2;
}

.ikili{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px,5vw,80px); align-items:center; }
.liste-cizgi{ display:grid; }
.liste-cizgi li{
  padding:17px 0; border-top:1px solid var(--cizgi-ters);
  display:flex; align-items:center; gap:14px; font-size:1.02rem;
}
.liste-cizgi li:last-child{ border-bottom:1px solid var(--cizgi-ters); }
.liste-cizgi svg{ width:17px; height:17px; flex:none; color:var(--mavi-acik); }
.bolum:not(.gece) .liste-cizgi li{ border-color:var(--cizgi); }
.bolum:not(.gece) .liste-cizgi svg{ color:var(--mavi); }

/* ===========================================================
   GALERİ
   =========================================================== */
.galeri-ray{ grid-auto-columns:minmax(260px,26%); }
.kare{
  position:relative; border-radius:18px; overflow:hidden; border:0; padding:0;
  background:var(--kagit-2); cursor:pointer; display:block; width:100%; user-select:none;
}
.kare img{ width:100%; aspect-ratio:3/4; object-fit:cover;
  pointer-events:none; transition:transform .8s var(--egri), filter .5s var(--egri-yumusak); }
.kare:hover img{ transform:scale(1.06); }
.kare .kare-yazi{
  position:absolute; inset:auto 0 0 0; padding:34px 18px 15px; text-align:left;
  font-size:.86rem; font-weight:600; color:#fff;
  background:linear-gradient(180deg, transparent, rgba(10,34,71,.85));
  opacity:0; transform:translateY(8px);
  transition:opacity .45s var(--egri), transform .45s var(--egri);
}
.kare:hover .kare-yazi, .kare:focus-visible .kare-yazi{ opacity:1; transform:none; }

/* Büyütme katmanı */
.buyutec{
  position:fixed; inset:0; z-index:300; background:rgba(8,28,58,.95);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  display:grid; place-items:center; padding:24px;
  opacity:0; visibility:hidden; transition:opacity .4s var(--egri), visibility .4s;
}
.buyutec.acik{ opacity:1; visibility:visible; }
.buyutec figure{ margin:0; display:flex; flex-direction:column; align-items:center; gap:16px; max-width:100%; }
.buyutec img{
  max-width:min(94vw,1000px); max-height:78vh; object-fit:contain; border-radius:14px;
  transform:scale(.94); transition:transform .5s var(--egri);
}
.buyutec.acik img{ transform:scale(1); }
.buyutec figcaption{ color:rgba(255,255,255,.72); font-size:.92rem; font-weight:500; }
.bt-kapat{
  position:absolute; top:20px; right:22px; width:44px; height:44px; border-radius:50%;
  border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.08); color:#fff;
  display:grid; place-items:center; transition:background .3s;
}
.bt-kapat:hover{ background:rgba(255,255,255,.2); }
.bt-ok{
  position:absolute; top:50%; margin-top:-24px; width:48px; height:48px; border-radius:50%;
  border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.08); color:#fff;
  display:grid; place-items:center; transition:background .3s;
}
.bt-ok:hover{ background:rgba(255,255,255,.2); }
.bt-ok.geri{ left:20px; } .bt-ok.ileri{ right:20px; }
.bt-ok svg,.bt-kapat svg{ width:18px; height:18px; }

/* ===========================================================
   SSS
   =========================================================== */
.sss-grup{ margin-bottom:56px; }
.sss-grup > h2{
  font-size:.78rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--metin-2); margin:0 0 8px; padding-bottom:14px; border-bottom:1px solid var(--cizgi);
}
.soru{ border-bottom:1px solid var(--cizgi); }
.soru summary{
  list-style:none; cursor:pointer; padding:24px 44px 24px 0; position:relative;
  font-size:clamp(1.05rem,1.7vw,1.24rem); font-weight:650; letter-spacing:-.022em; line-height:1.35;
  transition:color .3s;
}
.soru summary::-webkit-details-marker{ display:none; }
.soru summary:hover{ color:var(--mavi); }
.soru summary::after,.soru summary::before{
  content:''; position:absolute; right:8px; top:50%; background:currentColor; border-radius:2px;
  transition:transform .45s var(--egri), opacity .3s;
}
.soru summary::after{ width:15px; height:1.8px; margin-top:-.9px; }
.soru summary::before{ width:1.8px; height:15px; right:14.6px; margin-top:-7.5px; }
.soru[open] summary::before{ transform:rotate(90deg); opacity:0; }
.soru .cevap{ overflow:hidden; }
.soru .cevap p{
  margin:0; padding:0 15% 26px 0; color:var(--metin-2); font-size:1.02rem; line-height:1.68;
}

/* ===========================================================
   İLETİŞİM
   =========================================================== */
.iletisim-hero{ padding-block:clamp(100px,12vw,145px) clamp(48px,6vw,68px); }
.iletisim-hero .bolum-bas{ margin-bottom:0; }
.iletisim-kartlar{ padding:clamp(70px,8vw,108px) 0; background:var(--beyaz); }
.iletisim-izgara{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.ikart{
  border:1px solid var(--cizgi); border-radius:22px; padding:32px 28px;
  display:flex; flex-direction:column; align-items:flex-start; gap:10px; min-height:285px;
  background:var(--beyaz); color:var(--metin);
  transition:box-shadow .45s var(--egri-yumusak), transform .5s var(--egri), border-color .45s;
}
a.ikart:hover{ transform:translateY(-5px); border-color:rgba(20,107,163,.28); box-shadow:0 24px 54px -32px rgba(10,34,71,.4); }
.ikart-wa{ border-color:rgba(37,211,102,.48); }
a.ikart-wa:hover{ border-color:rgba(37,211,102,.8); box-shadow:0 24px 54px -32px rgba(37,211,102,.48); }
.ikart-ikon{
  width:44px; height:44px; border-radius:12px; display:grid; place-items:center; flex:none;
  color:#fff; background:linear-gradient(145deg, var(--mavi-parlak), var(--siyah));
  box-shadow:0 10px 22px -12px rgba(10,34,71,.75);
}
.ikart-bas{ display:flex; align-items:center; gap:13px; margin-bottom:5px; }
.ikart-wa .ikart-ikon{ color:#fff; background:var(--whatsapp); box-shadow:0 10px 22px -12px rgba(37,211,102,.8); }
.ikart-ikon svg{ width:19px; height:19px; }
.ikart .ust{ font-size:1.06rem; font-weight:700; letter-spacing:-.025em; color:var(--siyah); }
/* Değer, açıklamanın hemen altında dursun: margin-top:auto onu kartın
   dibine itip araya 72px boşluk açıyordu. */
.ikart .deger{ font-size:clamp(1.15rem,1.8vw,1.42rem); font-weight:700; letter-spacing:-.03em;
               margin-top:14px; line-height:1.35; color:var(--siyah); }
.ikart .not{ font-size:.92rem; color:var(--metin-2); margin:0; }
.ikart em{ font-style:normal; font-size:.86rem; color:var(--metin-2); font-weight:500;
           display:inline-block; margin-top:5px; }

.harita{
  border-radius:24px; overflow:hidden; aspect-ratio:16/9; background:var(--koyu-2);
  border:1px solid var(--cizgi-ters);
}
.harita iframe{ width:100%; height:100%; border:0; display:block; filter:grayscale(.25) contrast(1.05); }
.harita iframe[hidden]{ display:none; }
.harita-onay{
  min-height:100%; padding:32px; display:flex; flex-direction:column; align-items:center;
  justify-content:center; text-align:center; color:#fff;
  background:linear-gradient(145deg,var(--koyu-2),var(--siyah));
}
.harita-onay strong{ font-size:1.2rem; margin-bottom:8px; }
.harita-onay p{ max-width:34ch; color:var(--metin-ters-2); margin-bottom:20px; }
.harita.harita-aktif .harita-onay{ display:none; }

.adres-satir{
  font-size:clamp(1.3rem,2.6vw,2rem); font-weight:700; letter-spacing:-.035em;
  line-height:1.35; margin:0 0 26px;
}

/* ===========================================================
   KAPANIŞ
   =========================================================== */
.kapanis{ text-align:center; }
.kapanis .dugmeler{ justify-content:center; }
.kapanis .giris{ margin-inline:auto; }

/* Buz mavisi zeminde hayalet buton biraz daha belirgin çerçeve ister */
.kagit .dugme.hayalet{ --dg-cizgi:var(--kagit-cizgi); }

/* ===========================================================
   ALT BİLGİ
   =========================================================== */
.alt{ background:var(--siyah); color:var(--metin-ters-2); padding:72px 0 34px; font-size:.94rem;
      border-top:3px solid var(--koyu); }
.alt-izgara{ display:grid; grid-template-columns:1.45fr .9fr 1.05fr 1fr; gap:36px; padding-bottom:44px; }
.alt-marka{ color:#fff; font-size:1.35rem; font-weight:700; letter-spacing:-.03em; margin:0 0 8px; }
.alt h4{ color:#fff; font-size:.74rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; margin:0 0 16px; }
.alt-liste{ display:grid; gap:11px; }
.alt-liste a{ transition:color .3s; }
.alt-liste a:hover{ color:#fff; }
.alt-liste a[aria-current="page"]{ color:#fff; }
.alt-buton{
  width:max-content; padding:0; border:0; background:transparent; color:inherit;
  font:inherit; line-height:inherit; text-align:left; transition:color .3s;
}
.alt-buton:hover{ color:#fff; }
.alt-son{
  border-top:1px solid var(--cizgi-ters); padding-top:24px;
  display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:.82rem; opacity:.72;
}

/* Mobil alt çubuk */
.mobil-cubuk{ display:none; }

/* Sol altta sabit Instagram hesabı */
.instagram-sabit{
  position:fixed; left:24px; bottom:24px; z-index:94;
  width:54px; height:54px; display:grid; place-items:center;
  padding:0; border:2px solid rgba(255,255,255,.92); border-radius:50%;
  color:#fff;
  background:radial-gradient(circle at 30% 107%,#fdf497 0 5%,#fdf497 6%,#fd5949 45%,#d6249f 60%,#285aeb 90%);
  box-shadow:0 14px 38px -16px rgba(131,58,180,.8);
  transition:transform .35s var(--egri), box-shadow .35s var(--egri), border-color .35s;
}
.instagram-sabit:hover{
  transform:translateY(-3px) scale(1.04); border-color:#fff;
  box-shadow:0 18px 44px -16px rgba(131,58,180,.55);
}
.instagram-sabit:focus-visible{ outline:3px solid rgba(225,48,108,.36); outline-offset:3px; }
.instagram-ikon{
  width:100%; height:100%; display:grid; place-items:center;
  border-radius:50%; color:#fff;
}
.instagram-ikon svg{ width:25px; height:25px; }

/* ===========================================================
   YASAL SAYFALAR
   =========================================================== */
.yasal-hero{
  padding:clamp(132px,16vw,190px) 0 clamp(64px,8vw,92px);
  background:linear-gradient(145deg,var(--siyah),var(--koyu-2)); color:#fff;
}
.yasal-hero .buyuk{ max-width:15ch; }
.yasal-tarih{ margin:26px 0 0; color:var(--metin-ters-2); font-size:.9rem; }
.yasal-icerik{ padding:clamp(64px,8vw,108px) 0; background:var(--beyaz); }
.yasal-metin{ max-width:860px; }
.yasal-metin h2{
  margin:2.15em 0 .6em; color:var(--siyah); font-size:clamp(1.35rem,2.5vw,1.85rem);
  line-height:1.25; letter-spacing:-.025em;
}
.yasal-metin h2:first-of-type{ margin-top:1.5em; }
.yasal-metin h3{ margin:1.6em 0 .45em; color:var(--siyah); font-size:1.08rem; }
.yasal-metin p,.yasal-metin li{ color:var(--metin-2); }
.yasal-metin a:not(.dugme){ color:var(--mavi); text-decoration:underline; text-underline-offset:3px; }
.yasal-metin ul{ display:grid; gap:10px; padding-left:22px; list-style:disc; }
.yasal-metin address{ font-style:normal; padding:20px 22px; border-left:3px solid var(--mavi); background:var(--kagit); margin:18px 0; }
.yasal-uyari{
  padding:20px 22px; margin:26px 0; border:1px solid rgba(20,107,163,.22);
  border-radius:16px; background:var(--kagit);
}
.yasal-tablo-kap{ overflow-x:auto; margin:22px 0; border:1px solid var(--cizgi); border-radius:16px; }
.yasal-tablo{ width:100%; border-collapse:collapse; min-width:650px; font-size:.92rem; }
.yasal-tablo th,.yasal-tablo td{ padding:15px 17px; text-align:left; border-bottom:1px solid var(--cizgi); vertical-align:top; }
.yasal-tablo th{ background:var(--kagit); color:var(--siyah); }
.yasal-tablo tbody tr:last-child td{ border-bottom:0; }

/* ===========================================================
   ÇEREZ TERCİHLERİ
   =========================================================== */
.cerez-bant{
  position:fixed; left:50%; bottom:22px; z-index:360; width:min(1120px,calc(100% - 36px));
  display:none; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:24px;
  padding:20px 22px; border:1px solid rgba(255,255,255,.18); border-radius:20px;
  background:rgba(10,34,71,.98); color:#fff; box-shadow:0 24px 70px -22px rgba(4,17,38,.8);
  transform:translateX(-50%); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
}
.cerez-bant.goster{ display:grid; animation:cerezGir .45s var(--egri) both; }
@keyframes cerezGir{ from{ opacity:0; transform:translate(-50%,18px); } to{ opacity:1; transform:translate(-50%,0); } }
.cerez-metin strong{ display:block; margin-bottom:4px; font-size:1.03rem; }
.cerez-metin p{ margin:0; max-width:67ch; color:var(--metin-ters-2); font-size:.9rem; line-height:1.55; }
.cerez-metin a{ color:#fff; text-decoration:underline; text-underline-offset:3px; }
.cerez-eylemler{ display:grid; grid-template-columns:repeat(3,max-content); gap:8px; }
.cerez-eylem{
  min-height:42px; padding:9px 15px; border:1px solid rgba(255,255,255,.38); border-radius:999px;
  background:rgba(255,255,255,.1); color:#fff; font-size:.82rem; font-weight:700;
  transition:background .25s,border-color .25s,transform .25s;
}
.cerez-eylem:hover{ background:rgba(255,255,255,.2); border-color:#fff; transform:translateY(-1px); }
.cerez-katman{
  position:fixed; inset:0; z-index:370; display:grid; place-items:center; padding:20px;
  background:rgba(5,20,42,.74); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
}
.cerez-katman[hidden]{ display:none; }
.cerez-panel{
  width:min(590px,100%); max-height:min(760px,calc(100svh - 40px)); overflow:auto;
  padding:30px; border-radius:24px; background:#fff; box-shadow:0 30px 90px -28px rgba(4,17,38,.85);
}
.cerez-panel-bas{ display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin-bottom:12px; }
.cerez-panel h2{ margin:0; color:var(--siyah); font-size:1.65rem; letter-spacing:-.03em; }
.cerez-kapat{ width:40px; height:40px; flex:none; border:1px solid var(--cizgi); border-radius:50%; background:#fff; font-size:1.25rem; }
.cerez-panel > p{ color:var(--metin-2); font-size:.94rem; }
.cerez-secim{ display:flex; justify-content:space-between; align-items:center; gap:20px; padding:18px 0; border-top:1px solid var(--cizgi); }
.cerez-secim strong{ display:block; color:var(--siyah); }
.cerez-secim small{ display:block; max-width:42ch; margin-top:3px; color:var(--metin-2); line-height:1.45; }
.cerez-sabit-etiket{ flex:none; color:var(--mavi); font-size:.78rem; font-weight:700; }
.cerez-anahtar{ position:relative; width:50px; height:28px; flex:none; }
.cerez-anahtar input{ position:absolute; opacity:0; }
.cerez-anahtar span{ position:absolute; inset:0; border-radius:999px; background:#b8c3ce; transition:background .25s; }
.cerez-anahtar span::after{ content:''; position:absolute; width:22px; height:22px; left:3px; top:3px; border-radius:50%; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.25); transition:transform .25s; }
.cerez-anahtar input:checked + span{ background:var(--mavi); }
.cerez-anahtar input:checked + span::after{ transform:translateX(22px); }
.cerez-anahtar input:focus-visible + span{ outline:3px solid rgba(20,107,163,.3); outline-offset:3px; }
.cerez-panel-alt{ display:flex; justify-content:flex-end; gap:10px; flex-wrap:wrap; margin-top:18px; }
.cerez-panel-alt .dugme{ padding:12px 20px; font-size:.9rem; }

/* ===========================================================
   BELİRME ANİMASYONU
   =========================================================== */
.js .bel{ opacity:0; transform:translateY(34px); }
.js .bel.gorunur{
  opacity:1; transform:none;
  transition:opacity .9s var(--egri), transform .9s var(--egri);
}
.js .bel-gec.gorunur{ transition-delay:.09s; }
.js .bel-gec2.gorunur{ transition-delay:.18s; }

/* ===========================================================
   DUYARLI
   =========================================================== */
@media (max-width:1080px){
  /* Ana Sayfa bağlantısıyla uzayan menü tablette taşmasın. */
  .menu{ display:none; }
  .menu-ac{ display:block; }
  .hakkinda-izgara{ grid-template-columns:1fr; }
  .hakkinda-gorsel{ position:static; max-width:520px; }
  .ikili{ grid-template-columns:1fr; }
  .iletisim-izgara{ grid-template-columns:1fr 1fr; }
  .ray{ grid-auto-columns:minmax(300px,54%); }
  .galeri-ray{ grid-auto-columns:minmax(240px,38%); }
  .alt-izgara{ grid-template-columns:1.4fr 1fr 1fr; }
  .alt-izgara > div:first-child{ grid-column:1/-1; }
}

@media (max-width:760px){
  :root{ --kenar:20px; --bar-h:56px; }
  body{ font-size:16px; padding-bottom:62px; }

  .menu{ display:none; }
  .menu-ac{ display:block; }

  .kahraman{ min-height:92svh; }
  .kahraman-alt{ flex-direction:column; align-items:flex-start; gap:26px; }

  /* vw kullanmak sart: minmax(0,%) alt siniri 0 oldugu icin tarayici
     sutunlari cokertip kartlari 62px'e dusuruyordu. */
  .ray{ grid-auto-columns:82vw; }
  .galeri-ray{ grid-auto-columns:64vw; }
  .ray-oklar{ display:none; }
  .ray-bas{ flex-direction:column; align-items:flex-start; gap:16px; }

  .iletisim-izgara{ grid-template-columns:1fr; }
  .alt-izgara{ grid-template-columns:1fr; gap:34px; }
  .alt-son{ justify-content:flex-start; }
  .soru .cevap p{ padding-right:0; }
  /* Mobil büyüteç: görsel ekranı genişletmesin, yön düğmeleri görselin üstünde kalsın. */
  .buyutec{ padding:16px; overflow:hidden; }
  .buyutec figure{
    position:relative; z-index:1; width:100%; min-width:0;
    max-width:calc(100vw - 32px);
  }
  .buyutec img{
    width:auto; height:auto; max-width:100%;
    max-height:min(78vh,calc(100svh - 132px));
  }
  .buyutec figcaption{ max-width:100%; text-align:center; overflow-wrap:anywhere; }
  .bt-ok,.bt-kapat{ z-index:3; }
  .bt-ok{
    width:44px; height:44px; margin-top:-22px;
    background:rgba(8,28,58,.72); box-shadow:0 8px 24px rgba(0,0,0,.28);
  }
  .bt-ok.geri{ left:10px; } .bt-ok.ileri{ right:10px; }
  .manifesto p{ max-width:none; }

  /* Alt çubuk */
  .mobil-cubuk{
    display:grid; grid-template-columns:1fr 1fr; gap:1px;
    position:fixed; inset:auto 0 0 0; z-index:95;
    background:var(--cizgi); border-top:1px solid var(--cizgi);
    padding-bottom:env(safe-area-inset-bottom);
    backdrop-filter:blur(20px);
  }
  .mobil-cubuk a{
    display:flex; align-items:center; justify-content:center; gap:9px;
    padding:16px 8px; background:rgba(255,255,255,.92); color:var(--metin);
    font-weight:650; font-size:.95rem; letter-spacing:-.01em;
  }
  .mobil-cubuk a svg{ width:18px; height:18px; }
  .mobil-cubuk a.wa{ background:var(--whatsapp); color:#fff; }

  .instagram-sabit{
    left:14px; bottom:calc(76px + env(safe-area-inset-bottom));
    width:48px; height:48px;
  }
  .instagram-ikon svg{ width:23px; height:23px; }

  .cerez-bant{
    bottom:calc(72px + env(safe-area-inset-bottom)); width:calc(100% - 24px);
    grid-template-columns:1fr; gap:14px; padding:18px; border-radius:18px;
  }
  .cerez-eylemler{ grid-template-columns:repeat(3,1fr); }
  .cerez-eylem{ padding-inline:8px; }
  .cerez-panel{ padding:24px 20px; }
}

@media (max-width:420px){
  .ray{ grid-auto-columns:86vw; }
  .galeri-ray{ grid-auto-columns:70vw; }
  .dugmeler .dugme{ width:100%; }
  .cerez-eylemler{ grid-template-columns:1fr; }
  .cerez-eylem{ width:100%; }
}

/* Hareket azaltma tercihi */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important; scroll-behavior:auto !important;
  }
  .js .bel{ opacity:1; transform:none; }
  .kahraman-fon img,.kahraman h1 .sat > span,.kahraman-alt{ opacity:1; transform:none; }
  .paralaks img,.genis-gorsel img{ transform:none !important; }
  .manifesto .kelime{ color:var(--metin); }
}

@media print{
  .bar,.mobil-cubuk,.instagram-sabit,.buyutec,.menu-perde,.harita,.cerez-bant,.cerez-katman{ display:none !important; }
  .js .bel{ opacity:1; transform:none; }
  body{ padding:0; }
}
