/* ═══════════════════════════════════════════════════
   SANDAL HAFRİYAT — tasarım sistemi
   Renkler toprak profilinden alındı: kum → kil → koyu toprak,
   tek vurgu rengi olarak "kepçe sarısı".
   ═══════════════════════════════════════════════════ */

:root{
  /* toprak katmanları */
  --zemin:      #F2EEE7;   /* kireçtaşı tozu — sayfa zemini */
  --kum:        #E7E1D5;   /* kum katmanı */
  --kenar:      #D6CDBD;   /* hatlar */
  --toprak:     #16120F;   /* koyu toprak — hero, koyu bölümler */
  --toprak-2:   #241C16;   /* yüzey */
  --kil:        #6E4F31;   /* kil */

  /* mürekkep */
  --metin:      #221C17;
  --metin-2:    #6C6157;
  --metin-acik: #EFE8DE;
  --metin-acik-2: rgba(239,232,222,.62);

  /* vurgu */
  --kepce:      #E39B12;   /* iş makinesi sarısı */
  --kepce-koyu: #B77A06;
  --pas:        #A33F1C;   /* kot işaretleri */

  /* tipografi */
  --display: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --govde:   "IBM Plex Sans", system-ui, -apple-system, sans-serif;
  --veri:    "IBM Plex Mono", ui-monospace, "SF Mono", monospace;

  /* ölçü */
  --en:      1240px;
  --bosluk:  clamp(1.15rem, 4vw, 2rem);
  --bolum-y: clamp(4.5rem, 11vw, 8.5rem);
  --gecis:   .35s cubic-bezier(.2,.7,.3,1);
}

*,*::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(--zemin);
  color:var(--metin);
  font-family:var(--govde);
  font-size:clamp(1rem,.97rem + .2vw,1.075rem);
  line-height:1.65;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
body.kilit{ overflow:hidden; }

img,svg,iframe{ display:block; max-width:100%; }
a{ color:inherit; }
button{ font:inherit; color:inherit; }

h1,h2,h3{
  font-family:var(--display);
  font-variation-settings:"wdth" 112;
  letter-spacing:-.022em;
  line-height:1.02;
  margin:0;
  text-wrap:balance;
}

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

.sinir{ width:100%; max-width:var(--en); margin-inline:auto; padding-inline:var(--bosluk); }

.atla{
  position:fixed; top:-100px; left:1rem; z-index:99;
  background:var(--kepce); color:var(--toprak);
  padding:.7rem 1.1rem; font-weight:600; border-radius:2px;
}
.atla:focus{ top:1rem; }

/* ── etiket / kot işareti ───────────────────────── */
.etiket{
  font-family:var(--veri);
  font-size:.72rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--metin-2); margin:0 0 1.1rem;
  display:flex; flex-wrap:wrap; align-items:center; gap:.7rem;
}
.etiket--acik{ color:var(--metin-acik-2); }
.kot{
  color:var(--pas); border:1px solid currentColor;
  padding:.2rem .5rem; border-radius:2px; font-size:.68rem; letter-spacing:.08em;
}
.etiket--acik .kot{ color:var(--kepce); }

/* ── düğmeler ───────────────────────────────────── */
.dugme{
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  padding:.85rem 1.4rem; border:1px solid transparent; border-radius:2px;
  font-family:var(--govde); font-weight:600; font-size:.95rem;
  text-decoration:none; cursor:pointer;
  transition:background var(--gecis), color var(--gecis), border-color var(--gecis), transform var(--gecis);
}
.dugme svg{ width:1.05em; height:1.05em; fill:currentColor; }
.dugme--kepce{ background:var(--kepce); color:#1B1206; }
.dugme--kepce:hover{ background:#F5AC22; transform:translateY(-2px); }
.dugme--hat{ border-color:rgba(239,232,222,.4); color:var(--metin-acik); }
.dugme--hat:hover{ border-color:var(--metin-acik); background:rgba(239,232,222,.08); }
.dugme--buyuk{ padding:1.05rem 1.7rem; font-size:1.02rem; }
.dugme--tam{ width:100%; }

/* ═══ ÜST BAR ═══════════════════════════════════ */
.ust{
  position:fixed; inset:0 0 auto; z-index:40;
  transition:background var(--gecis), box-shadow var(--gecis), border-color var(--gecis);
  border-bottom:1px solid transparent;
}
.ust__ic{ display:flex; align-items:center; gap:1.25rem; height:70px; }
.ust[data-sabit]{
  background:rgba(22,18,15,.94);
  backdrop-filter:blur(10px);
  border-bottom-color:rgba(227,155,18,.28);
}

.marka{ display:flex; align-items:center; gap:.6rem; text-decoration:none; margin-right:auto; }
.marka__im{ width:19px; height:19px; fill:var(--kepce); transform:rotate(180deg); flex:none; }
.marka__ad{
  font-family:var(--display); font-variation-settings:"wdth" 105;
  font-weight:800; font-size:1.12rem; letter-spacing:-.01em;
  color:var(--metin-acik); text-transform:uppercase; line-height:1;
}
.marka__ad b{ font-weight:400; color:var(--kepce); }

.menu{ display:none; }
.ust__cta{ display:none; }

.hamburger{
  width:44px; height:44px; display:grid; place-content:center; gap:5px;
  background:none; border:1px solid rgba(239,232,222,.3); border-radius:2px; cursor:pointer;
}
.hamburger span{ display:block; width:19px; height:2px; background:var(--metin-acik); transition:transform var(--gecis), opacity var(--gecis); }
.hamburger[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.hamburger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.hamburger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* mobil menü */
@media (max-width:1023px){
  .menu{
    position:fixed; inset:70px 0 0; z-index:39;
    background:var(--toprak);
    display:flex; flex-direction:column; justify-content:center; gap:.35rem;
    padding:2rem var(--bosluk) 6rem;
    transform:translateY(-8px); opacity:0; pointer-events:none;
    transition:opacity var(--gecis), transform var(--gecis);
  }
  .menu[data-acik]{ opacity:1; transform:none; pointer-events:auto; }
  .menu a{
    font-family:var(--display); font-variation-settings:"wdth" 108;
    font-weight:700; font-size:clamp(1.7rem,8vw,2.4rem); text-transform:uppercase;
    color:var(--metin-acik); text-decoration:none; padding:.35rem 0;
    border-bottom:1px solid rgba(239,232,222,.1);
  }
  .menu a:last-child{ border:none; color:var(--kepce); font-family:var(--veri); font-size:1.1rem; margin-top:1rem; }
}

/* ═══ HERO ══════════════════════════════════════ */
.hero{ position:relative; background:var(--toprak); color:var(--metin-acik); overflow:hidden; }
.hero__foto{ position:absolute; inset:0; }
.hero__foto img{ width:100%; height:100%; object-fit:cover; opacity:.62; }
/* Görsel .gorsel img kuralından z-index:1 alıyor; karartma katmanının
   altında kalması için sıfırlanıyor. */
.hero .hero__foto img{ z-index:0; }
.hero::after{
  content:""; position:absolute; inset:0;
  background:
    linear-gradient(90deg,rgba(20,16,13,.93) 0%,rgba(20,16,13,.72) 42%,rgba(20,16,13,.28) 78%,rgba(20,16,13,.42) 100%),
    linear-gradient(180deg,rgba(20,16,13,.82) 0%,rgba(20,16,13,.34) 40%,rgba(20,16,13,.9) 92%);
}
.hero__ic{
  position:relative; z-index:2;
  padding-top:clamp(7rem,17vw,9rem);
  padding-bottom:clamp(3.5rem,10vw,5.5rem);
  max-width:1020px;
}
.hero__baslik{
  font-size:clamp(2.3rem,6.6vw,4.55rem);
  font-weight:800; font-variation-settings:"wdth" 116;
  line-height:.98;
  text-transform:uppercase; color:#fff;
  margin-bottom:1.4rem;
}
.hero__baslik em{
  font-style:normal; color:var(--kepce);
  -webkit-text-stroke:0;
}
.hero__alt{
  font-size:clamp(1.02rem,.96rem + .5vw,1.22rem);
  color:var(--metin-acik-2); max-width:44ch; margin:0 0 2.2rem;
}
.hero__dugmeler{ display:flex; flex-wrap:wrap; gap:.75rem; }
.hero__dugmeler .dugme--kepce{ font-family:var(--veri); font-weight:600; letter-spacing:.02em; }

/* toprak katmanları şeridi */
.katmanlar{ position:relative; z-index:2; display:flex; flex-direction:column; }
.katmanlar i{ height:3px; }
.katmanlar i:nth-child(1){ background:var(--kepce); height:4px; }
.katmanlar i:nth-child(2){ background:#8A6034; }
.katmanlar i:nth-child(3){ background:#5E4227; height:2px; }
.katmanlar i:nth-child(4){ background:#3E2C1B; }
.katmanlar i:nth-child(5){ background:#2A1E13; height:6px; }

.hero__veri{ position:relative; z-index:2; background:var(--toprak-2); }
.hero__veri-ic{
  display:grid; grid-template-columns:repeat(2,1fr);
  border-left:1px solid rgba(239,232,222,.09);
}
.veri{
  padding:1.35rem 1rem;
  border-right:1px solid rgba(239,232,222,.09);
  border-bottom:1px solid rgba(239,232,222,.09);
}
.hero__veri-ic .veri:nth-last-child(-n+2){ border-bottom:none; }
.veri b{
  display:block; font-family:var(--display); font-variation-settings:"wdth" 110;
  font-size:clamp(1.6rem,5.5vw,2.35rem); font-weight:800; line-height:1;
  color:var(--kepce); margin-bottom:.3rem;
}
.veri span{ font-family:var(--veri); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--metin-acik-2); }

/* ═══ BÖLÜM ORTAK ═══════════════════════════════ */
.bolum{ padding-block:var(--bolum-y); position:relative; }
.bolum--koyu{ background:var(--toprak); color:var(--metin-acik); }
.bolum--kum{ background:var(--kum); }
.bolum--koyu .bolum__giris,
.bolum--koyu p{ color:var(--metin-acik-2); }

.bolum__bas{ max-width:56ch; margin-bottom:clamp(2.2rem,5vw,3.4rem); }
.bolum__baslik{
  font-size:clamp(1.95rem,6vw,3.35rem); font-weight:800;
  font-variation-settings:"wdth" 113; text-transform:uppercase;
  margin-bottom:1rem;
}
.bolum--koyu .bolum__baslik{ color:#fff; }
.bolum__giris{ margin:0; color:var(--metin-2); font-size:1.05rem; }

/* ═══ GÖRSEL YUVASI ═════════════════════════════ */
/* Görsel yoksa yerine dosya adını gösterir — hangi karenin
   hangi dosyayı beklediği bakınca anlaşılsın diye. */
.gorsel{
  position:relative; overflow:hidden; background:var(--kum);
  background-image:repeating-linear-gradient(180deg,
    rgba(110,79,49,.10) 0 6px, rgba(110,79,49,.03) 6px 14px);
}
.bolum--koyu .gorsel,
.hero__foto{ background-color:#1C1611; background-image:repeating-linear-gradient(180deg,rgba(227,155,18,.07) 0 6px,rgba(227,155,18,.02) 6px 14px); }
.gorsel::before{
  content:attr(data-dosya);
  position:absolute; inset:0; z-index:0;
  display:grid; place-content:center; text-align:center; padding:1rem;
  font-family:var(--veri); font-size:.68rem; letter-spacing:.04em;
  color:var(--kil); opacity:.75; word-break:break-all;
}
.bolum--koyu .gorsel::before{ color:var(--kepce); opacity:.5; }
.hero__foto::before{
  color:var(--kepce); opacity:.45; z-index:3;
  place-content:start end; padding:5.5rem 1.4rem;
}
.gorsel img{ position:relative; z-index:1; width:100%; height:100%; object-fit:cover; }

/* Görsel yüklendiyse dosya adı yer tutucusu gizlensin */
.gorsel:has(img)::before{ display:none; }

/* .gorsel bu dosyada sonra tanımlandığı için hero görselinin
   position:absolute değerini eziyordu — özgüllüğü artırarak sabitliyoruz. */
.hero .hero__foto{ position:absolute; inset:0; }
.oran-43{ aspect-ratio:4/3; }
.oran-45{ aspect-ratio:4/5; }

/* ═══ HİZMETLER ═════════════════════════════════ */
/* Yüzen kart yok: ölçüm tablosu gibi ince hatlarla ayrılmış hücreler */
.izgara{
  display:grid; grid-template-columns:1fr;
  border-top:1px solid var(--kenar); border-left:1px solid var(--kenar);
}
.hizmet{
  border-right:1px solid var(--kenar); border-bottom:1px solid var(--kenar);
  padding:0 0 1.6rem; background:transparent;
  transition:background var(--gecis);
}
.hizmet:hover{ background:rgba(227,155,18,.06); }
.hizmet .gorsel{ margin-bottom:1.25rem; filter:saturate(.75) contrast(1.03); transition:filter var(--gecis); }
.hizmet:hover .gorsel{ filter:saturate(1.05); }
.hizmet h3{
  font-size:1.32rem; font-weight:700; font-variation-settings:"wdth" 108;
  padding-inline:1.35rem; margin-bottom:.55rem;
}
.hizmet p{ padding-inline:1.35rem; margin:0; color:var(--metin-2); font-size:.97rem; }

.izgara__not{
  margin:1.7rem 0 0; font-size:.95rem; color:var(--metin-2);
}
.izgara__not a{ color:var(--kepce-koyu); text-underline-offset:3px; font-weight:600; }

/* ═══ HAKKIMIZDA ════════════════════════════════ */
.ikili{ display:grid; gap:clamp(2rem,5vw,3.5rem); }
.ikili__foto{ border:1px solid rgba(227,155,18,.22); }
.ikili__metin p{ margin:0 0 1.1rem; }
.ikili--tek .ikili__metin{ max-width:62ch; }

.zaman{ list-style:none; margin:2.2rem 0 0; padding:0; border-top:1px solid rgba(239,232,222,.14); }
.zaman li{
  display:grid; grid-template-columns:5.5rem 1fr; gap:1rem; align-items:baseline;
  padding:1rem 0; border-bottom:1px solid rgba(239,232,222,.14);
}
.zaman b{ font-family:var(--veri); font-size:.95rem; color:var(--kepce); letter-spacing:.04em; }
.zaman span{ color:var(--metin-acik-2); font-size:.97rem; }

/* ═══ ARAÇ PARKI ════════════════════════════════ */
.araclar{ display:grid; grid-template-columns:1fr; gap:1px; background:var(--kenar); border:1px solid var(--kenar); }
.arac{ background:var(--zemin); padding-bottom:1.2rem; }
.arac .gorsel{ margin-bottom:1.1rem; }
.arac h3{ font-size:1.2rem; font-weight:700; padding-inline:1.25rem; margin-bottom:.7rem; }
.arac dl{ margin:0; padding-inline:1.25rem; font-family:var(--veri); font-size:.78rem; }
.arac dl div{ display:flex; justify-content:space-between; gap:1rem; padding:.42rem 0; border-top:1px dotted var(--kenar); }
.arac dt{ color:var(--metin-2); text-transform:uppercase; letter-spacing:.08em; }
.arac dd{ margin:0; text-align:right; }

/* ═══ GALERİ ════════════════════════════════════ */
.galeri{ display:grid; grid-template-columns:repeat(2,1fr); gap:.55rem; }
.galeri__ogesi{
  border:0; padding:0; margin:0; cursor:pointer; aspect-ratio:1/1;
  background:var(--kenar); border-radius:2px;
}
.galeri__ogesi img{ transition:transform .5s cubic-bezier(.2,.7,.3,1); }
.galeri__ogesi:hover img{ transform:scale(1.05); }
.galeri__ogesi--genis{ grid-column:span 2; aspect-ratio:16/9; }

/* ═══ SÜREÇ ═════════════════════════════════════ */
.surec{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:1fr;
  border-top:2px solid var(--toprak);
}
.surec li{ padding:1.6rem 0; border-bottom:1px solid var(--kenar); }
.surec b{
  display:block; font-family:var(--veri); font-size:.8rem; letter-spacing:.14em;
  color:var(--kepce-koyu); margin-bottom:.6rem;
}
.surec h3{ font-size:1.35rem; font-weight:700; margin-bottom:.4rem; }
.surec p{ margin:0; color:var(--metin-2); font-size:.97rem; }

/* ═══ İLETİŞİM ══════════════════════════════════ */
.iletisim{ display:grid; gap:clamp(2.5rem,6vw,4rem); }

.kartlar{ list-style:none; margin:2rem 0 0; padding:0; }
.kartlar li{
  display:flex; flex-direction:column; gap:.2rem;
  padding:1.1rem 0; border-bottom:1px solid rgba(239,232,222,.14);
}
.kartlar span{
  font-family:var(--veri); font-size:.68rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--metin-acik-2); margin-bottom:.35rem;
}
.kartlar a,.kartlar b{
  font-family:var(--veri); font-size:1.02rem; font-weight:500;
  color:var(--metin-acik); text-decoration:none; line-height:1.55;
  transition:color var(--gecis);
}
.kartlar a:hover{ color:var(--kepce); }

.cta-kutu{
  background:var(--toprak-2); border:1px solid rgba(239,232,222,.12);
  padding:clamp(1.6rem,4vw,2.4rem); border-radius:2px;
}
.cta-kutu__bas{
  margin:0 0 .9rem; font-family:var(--veri); font-size:.78rem;
  letter-spacing:.1em; text-transform:uppercase; color:var(--kepce);
}
.cta-kutu__metin{ margin:0 0 1.6rem; color:var(--metin-acik-2); }
.cta-kutu .dugme{ margin-bottom:.8rem; }
.cta-kutu__not{
  margin:1.1rem 0 0; font-family:var(--veri); font-size:.76rem;
  letter-spacing:.05em; color:var(--metin-acik-2);
}
.dugme--wa{ background:#1E9E52; color:#fff; }
.dugme--wa:hover{ background:#23B25E; transform:translateY(-2px); }

.harita{ margin-top:clamp(2.5rem,6vw,4rem); border-top:1px solid rgba(239,232,222,.14); }
.harita iframe{ width:100%; height:clamp(260px,42vw,400px); border:0; filter:grayscale(.5) contrast(1.05); }

/* ═══ ALT BİLGİ ═════════════════════════════════ */
.alt{ background:#0F0C0A; color:var(--metin-acik-2); padding-block:3rem 5.5rem; }
.alt__ic{ display:grid; gap:1.8rem; }
.alt__marka p{ margin:.7rem 0 0; font-size:.92rem; max-width:38ch; }
.alt__menu{ display:flex; flex-wrap:wrap; gap:.4rem 1.4rem; }
.alt__menu a{ font-family:var(--veri); font-size:.8rem; letter-spacing:.06em; text-decoration:none; transition:color var(--gecis); }
.alt__menu a:hover{ color:var(--kepce); }
.alt__telif{ margin:0; font-family:var(--veri); font-size:.72rem; letter-spacing:.06em; opacity:.6; }

/* ═══ MOBİL ALT ÇUBUK ═══════════════════════════ */
.mobil-bar{
  position:fixed; inset:auto 0 0; z-index:38;
  display:grid; grid-template-columns:1fr 1fr;
  padding-bottom:env(safe-area-inset-bottom);
  background:var(--toprak); border-top:1px solid rgba(227,155,18,.3);
}
.mobil-bar a{
  display:flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.95rem .5rem; text-decoration:none;
  font-weight:600; font-size:.95rem; color:var(--metin-acik);
}
.mobil-bar a:first-child{ background:var(--kepce); color:#1B1206; }
.mobil-bar svg{ width:1.15em; height:1.15em; fill:currentColor; }
.mobil-bar--wa{ background:#0F0C0A; }

/* ═══ BÜYÜTEÇ ═══════════════════════════════════ */
.buyutec{
  position:fixed; inset:0; z-index:60;
  background:rgba(10,8,6,.95); display:grid; place-items:center;
  padding:clamp(1rem,5vw,3rem);
}
.buyutec[hidden]{ display:none; }
.buyutec img{ max-width:100%; max-height:82vh; object-fit:contain; border-radius:2px; }
.buyutec button{ background:none; border:0; color:var(--metin-acik); cursor:pointer; line-height:1; }
.buyutec__kapat{ position:absolute; top:1rem; right:1.2rem; font-size:2.6rem; }
.buyutec__ok{ position:absolute; top:50%; transform:translateY(-50%); font-size:3.2rem; padding:.5rem 1rem; }
.buyutec__ok--sol{ left:.2rem; }
.buyutec__ok--sag{ right:.2rem; }

/* ═══ HİZMET BÖLGELERİ ══════════════════════════ */
.bolgeler{
  display:grid; grid-template-columns:1fr;
  border-top:1px solid var(--kenar); border-left:1px solid var(--kenar);
}
.bolge{
  display:flex; flex-direction:column; gap:.3rem;
  padding:1.25rem 1.35rem; text-decoration:none;
  border-right:1px solid var(--kenar); border-bottom:1px solid var(--kenar);
  transition:background var(--gecis);
}
.bolge:hover{ background:rgba(227,155,18,.08); }
.bolge b{
  font-family:var(--display); font-variation-settings:"wdth" 108;
  font-weight:700; font-size:1.12rem;
}
.bolge b::after{ content:" →"; color:var(--kepce-koyu); }
.bolge span{ font-size:.88rem; color:var(--metin-2); }

/* ═══ SSS ═══════════════════════════════════════ */
.sss{ max-width:76ch; border-top:2px solid var(--toprak); }
.sss__oge{ border-bottom:1px solid var(--kenar); }
.sss__oge summary{
  cursor:pointer; list-style:none;
  display:flex; justify-content:space-between; align-items:baseline; gap:1rem;
  padding:1.15rem 0;
  font-family:var(--display); font-variation-settings:"wdth" 106;
  font-weight:700; font-size:1.08rem; line-height:1.3;
}
.sss__oge summary::-webkit-details-marker{ display:none; }
.sss__oge summary::after{
  content:"+"; font-family:var(--veri); color:var(--kepce-koyu);
  font-size:1.3rem; line-height:1; flex:none;
}
.sss__oge[open] summary::after{ content:"−"; }
.sss__oge p{ margin:0 0 1.2rem; color:var(--metin-2); max-width:70ch; }

/* ═══ İÇ SAYFALAR (bölge sayfaları) ═════════════ */
/* Üst bar iç sayfalarda koyu hero olmadığı için baştan zeminli ve
   yapışkan olur; fixed yerine sticky akışta yer kapladığından
   içerik başlangıcı ezilmez. */
.ust--duz{
  position:sticky; inset:auto; top:0;
  background:rgba(22,18,15,.97);
  border-bottom-color:rgba(227,155,18,.28);
}
.kirinti{
  font-family:var(--veri); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase;
  color:var(--metin-2); margin:0 0 1.6rem;
  display:flex; gap:.5rem; flex-wrap:wrap;
}
.kirinti a{ color:var(--kepce-koyu); text-decoration:none; }
.kirinti a:hover{ text-decoration:underline; }
.icerik{ max-width:72ch; }
.icerik h2{ font-size:clamp(1.35rem,3vw,1.7rem); margin:2.4rem 0 .9rem; }
.icerik p{ margin:0 0 1.1rem; }
.icerik ul{ margin:0 0 1.1rem; padding-left:1.2rem; }
.icerik li{ margin-bottom:.35rem; }
.icerik .cta-kutu{ margin-top:2.2rem; }
.icerik .cta-kutu p{ margin:0 0 1.6rem; }

/* ═══ DERİNLİK CETVELİ (imza) ═══════════════════ */
.cetvel{ display:none; }

/* ═══ GİRİŞ ANİMASYONU ══════════════════════════ */
[data-bel]{ opacity:0; transform:translateY(16px); }
[data-bel].gorundu{ opacity:1; transform:none; transition:opacity .5s ease, transform .5s cubic-bezier(.2,.7,.3,1); }

@media (prefers-reduced-motion:reduce){
  [data-bel],[data-bel].gorundu{ opacity:1; transform:none; transition:none; }
  *{ animation-duration:.01ms !important; transition-duration:.01ms !important; }
}

/* ═══════════════════════════════════════════════
   ✦ 640px — küçük tablet
   ═══════════════════════════════════════════════ */
@media (min-width:640px){
  .izgara{ grid-template-columns:repeat(2,1fr); }
  .araclar{ grid-template-columns:repeat(2,1fr); }
  .bolgeler{ grid-template-columns:repeat(2,1fr); }
  .surec{ grid-template-columns:repeat(2,1fr); column-gap:2rem; }
  .hero__veri-ic{ grid-template-columns:repeat(4,1fr); }
  .veri{ border-bottom:none; }
  .galeri{ grid-template-columns:repeat(3,1fr); gap:.7rem; }
  .galeri__ogesi--genis{ grid-column:span 2; aspect-ratio:auto; }
  .galeri__ogesi--uzun{ grid-row:span 2; aspect-ratio:auto; }
  .alt__ic{ grid-template-columns:1fr auto; align-items:start; }
  .alt__telif{ grid-column:1/-1; padding-top:1.4rem; border-top:1px solid rgba(239,232,222,.1); }
}

/* ═══════════════════════════════════════════════
   ✦ 1024px — masaüstü
   ═══════════════════════════════════════════════ */
@media (min-width:1024px){
  .hamburger{ display:none; }
  .mobil-bar{ display:none; }
  .alt{ padding-bottom:3rem; }

  .menu{ display:flex; align-items:center; gap:1.6rem; }
  .menu a{
    font-family:var(--govde); font-size:.92rem; font-weight:500;
    color:var(--metin-acik); text-decoration:none; position:relative; padding:.2rem 0;
    transition:color var(--gecis);
  }
  .menu a::after{
    content:""; position:absolute; left:0; right:0; bottom:-3px; height:2px;
    background:var(--kepce); transform:scaleX(0); transform-origin:left;
    transition:transform var(--gecis);
  }
  .menu a:hover{ color:var(--kepce); }
  .menu a:hover::after{ transform:scaleX(1); }
  .menu__tel{ display:none; }
  .ust__cta{ display:inline-flex; }
  .ust__ic{ height:82px; }

  .izgara{ grid-template-columns:repeat(3,1fr); }
  .araclar{ grid-template-columns:repeat(3,1fr); }
  .bolgeler{ grid-template-columns:repeat(4,1fr); }
  .surec{ grid-template-columns:repeat(4,1fr); column-gap:1.8rem; }
  .surec li{ border-bottom:none; border-right:1px solid var(--kenar); padding-right:1.4rem; }
  .surec li:last-child{ border-right:none; }

  .ikili{ grid-template-columns:.85fr 1fr; align-items:center; }
  .ikili--tek{ grid-template-columns:1fr; }
  .iletisim{ grid-template-columns:1fr .85fr; align-items:start; }
}

/* ═══════════════════════════════════════════════
   ✦ 1500px — derinlik cetveli açılır
   Sadece içeriğin solunda gerçekten yer varken görünür,
   böylece hiçbir kırılımda metnin üstüne binmez.
   ═══════════════════════════════════════════════ */
@media (min-width:1500px){
  .cetvel{
    position:fixed; top:50%; z-index:30; display:block;
    left:calc((100vw - var(--en)) / 2 - 112px);
    width:96px; transform:translateY(-50%); pointer-events:none;
  }
  .cetvel__kot{
    font-family:var(--veri); font-size:1.05rem; font-weight:600;
    color:var(--kepce-koyu); letter-spacing:.02em; margin-bottom:.5rem;
    font-variant-numeric:tabular-nums;
  }
  .cetvel__kot small{ font-size:.6rem; opacity:.6; margin-left:.15rem; }
  .cetvel__hat{
    position:relative; width:2px; height:150px; margin-left:3px;
    background:rgba(110,79,49,.28); overflow:hidden;
  }
  .cetvel__ilerleme{
    position:absolute; inset:0 0 auto; height:0%;
    background:var(--kepce); transition:height .12s linear;
  }
  .cetvel__list{
    list-style:none; margin:.8rem 0 0; padding:0;
    font-family:var(--veri); font-size:.62rem; letter-spacing:.1em; text-transform:uppercase;
  }
  .cetvel__list li{
    color:var(--metin-2); opacity:.42; padding:.18rem 0;
    transition:opacity var(--gecis), color var(--gecis), transform var(--gecis);
  }
  .cetvel__list li[data-etkin]{ opacity:1; color:var(--kepce-koyu); transform:translateX(3px); }

  /* koyu bölümlerin hizasındayken cetvel açık renge döner */
  .cetvel[data-koyu] .cetvel__kot{ color:var(--kepce); }
  .cetvel[data-koyu] .cetvel__hat{ background:rgba(239,232,222,.2); }
  .cetvel[data-koyu] .cetvel__list li{ color:var(--metin-acik); }
  .cetvel[data-koyu] .cetvel__list li[data-etkin]{ color:var(--kepce); }
}
