:root{
  --gold:#C9A34E; --gold-dk:#8A6A28; --gold-lt:#E3C77E;
  --navy:#0C1B2A; --navy-2:#1E3A57;
  --cream:#F4F2ED;
  --line:rgba(12,27,42,.14);
  --line-soft:rgba(12,27,42,.075);

  /* ——— Emons'un font hissine en yakın Google Fonts karşılığı ——— */
  --font-display:'Onest', system-ui, sans-serif;
  --display-wdth:100;              /* Onest'te genişlik ekseni yok, etkisiz */
  --font-body:'Onest', system-ui, sans-serif;

  --ease:cubic-bezier(.22,1,.36,1);

  /* Sayfa kenarı — nav, hero metni ve TÜM bölüm sarmalayıcıları aynı hizada kalsın diye
     tek yerden yönetiliyor. Daha önce 1680px'ti; geniş ekranda başlıklar içeri kaçıp
     kartlarla hizasını kaybediyordu. */
  --en:1920px;
  --kenar:40px;
}
*{margin:0;padding:0;box-sizing:border-box}
/* not: yumuşak kaydırmayı Lenis yönetiyor, CSS smooth ile çakışmasın diye kapalı */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{font-family:var(--font-body);background:var(--cream);color:var(--navy);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{text-decoration:none;color:inherit}
button{font-family:inherit;border:none;background:none;cursor:pointer;color:inherit}
img{display:block;max-width:100%}

/* ═══════════════════════════════════════════
   SAHNE — hero ve çok modlu kare tek pin içinde
   scroll ile sahne değişir, sayfa yerinde durur
   ═══════════════════════════════════════════ */
/* sticky pin kendi katmanını yarattığı için nav sonraki bölümün altında kalıyordu;
   stage'i üst katmana alınca sabit menü her zaman üstte durur */
.stage{position:relative;z-index:5;height:186vh}
.stage-pin{position:sticky;top:0;height:100svh;overflow:hidden;display:flex;flex-direction:column}

/* — görsel katmanı — */
.scenes{position:absolute;inset:0;z-index:0}
.scene{position:absolute;inset:0;opacity:0;transition:opacity .85s var(--ease)}
.scene.on{opacity:1}
.scene img{width:100%;height:100%;object-fit:cover;object-position:52% 44%;transform:scale(1.05);transition:transform 1.4s var(--ease)}
.scene.on img{transform:scale(1)}
/* metin okunurluğu: sol alttan krem yıkama + üstte nav bandı */
.scenes::after{
  content:'';position:absolute;inset:0;z-index:2;pointer-events:none;
  background:
    radial-gradient(96% 74% at 6% 104%, rgba(244,242,237,.98) 0%, rgba(244,242,237,.92) 30%, rgba(244,242,237,.5) 54%, rgba(244,242,237,0) 74%),
    linear-gradient(180deg, rgba(244,242,237,.92) 0%, rgba(244,242,237,.18) 12%, rgba(244,242,237,0) 24%);
}

/* ═══════════ NAV ═══════════ */
/* Nav BAŞTAN sabit duruyor. Önceden scroll bitince relative→fixed geçiyordu; akıştan
   çıktığı anda içerik yukarı sıçrıyor ve "tak" diye giriyordu. Artık yalnızca görünümü
   (yükseklik, zemin, çizgi) yumuşakça değişiyor. */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:60;
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  padding:24px var(--kenar);
  background:transparent;
  border-bottom:1px solid transparent;
  transition:padding .45s var(--ease),background .45s var(--ease),
             border-color .45s var(--ease),backdrop-filter .45s var(--ease);
}
.nav.stuck{
  padding:12px var(--kenar);
  background:rgba(244,242,237,.94);
  backdrop-filter:blur(16px);
  border-bottom-color:var(--line-soft);
}

.brand{justify-self:start}
/* logo dosyasının kendi şeffaf kenar boşluğu var; negatif marj ile optik olarak
   sayfa kenarına hizalanıyor */
.brand img{height:54px;width:auto;margin-left:-7px;transition:height .35s var(--ease)}
.nav.stuck .brand img{height:38px}

.nav-links{display:flex;align-items:center;gap:32px;justify-self:center}
.nav-item{position:relative;padding:15px 0}
.nav-link{
  display:flex;align-items:center;gap:7px;
  font-size:12.5px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;
  color:var(--navy);white-space:nowrap;position:relative;
}
.nav-link::after{content:'';position:absolute;left:0;bottom:-6px;height:1.5px;width:0;background:var(--gold);transition:width .34s var(--ease)}
.nav-item:hover .nav-link::after{width:100%}
.nav-link.on{color:var(--gold-dk)}
.nav-link.on::after{width:100%}
.caret{width:8px;height:8px;stroke:currentColor;fill:none;stroke-width:2.6;opacity:.45;transition:transform .3s var(--ease)}
.nav-item:hover .caret{transform:rotate(180deg);opacity:1}

/* ——— mega menü: perde gibi iner, satırlar sırayla belirir ——— */
.mega{
  position:absolute;top:100%;left:50%;width:max-content;
  transform:translateX(-50%);
  padding-top:13px;                      /* nav ile panel arası hover köprüsü */
  opacity:0;visibility:hidden;
  clip-path:inset(0 -70px 100% -70px);   /* yanlarda negatif pay: gölge kesilmesin */
  transition:opacity .3s var(--ease),clip-path .55s var(--ease),visibility .55s;
}
.nav-item:hover .mega{opacity:1;visibility:visible;clip-path:inset(0 -70px -70px -70px)}
.mega-in{
  background:var(--cream);
  border:1px solid var(--line);
  border-top:2px solid var(--gold);
  box-shadow:0 34px 72px -42px rgba(12,27,42,.58), 0 5px 16px -10px rgba(12,27,42,.22);
}
.mega-grid{display:grid;padding:9px}
.mega.two .mega-grid{
  grid-template-columns:repeat(2,minmax(272px,1fr));
  grid-template-rows:repeat(5,auto);
  grid-auto-flow:column;                 /* başlık + 4 solda, başlık + 3 sağda */
  column-gap:14px;
}
.mega.one .mega-grid{grid-template-columns:minmax(252px,1fr)}
.mg-h{
  padding:6px 15px 9px;margin-bottom:4px;border-bottom:1px solid var(--line-soft);
  font-size:9.5px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:rgba(12,27,42,.36);
}
.mg{
  position:relative;display:flex;align-items:center;gap:15px;padding:11px 15px;
}
.mega-grid>*{
  opacity:0;transform:translateY(9px);
  transition:opacity .42s var(--ease),transform .42s var(--ease),background .26s var(--ease);
  transition-delay:0s;                   /* kapanırken beklemesin */
}
.nav-item:hover .mega-grid>*{opacity:1;transform:none}
.nav-item:hover .mega-grid>:nth-child(1){transition-delay:.02s}
.nav-item:hover .mega-grid>:nth-child(2){transition-delay:.06s}
.nav-item:hover .mega-grid>:nth-child(3){transition-delay:.1s}
.nav-item:hover .mega-grid>:nth-child(4){transition-delay:.14s}
.nav-item:hover .mega-grid>:nth-child(5){transition-delay:.18s}
.nav-item:hover .mega-grid>:nth-child(6){transition-delay:.06s}
.nav-item:hover .mega-grid>:nth-child(7){transition-delay:.1s}
.nav-item:hover .mega-grid>:nth-child(8){transition-delay:.14s}
.nav-item:hover .mega-grid>:nth-child(9){transition-delay:.18s}
.mg::before{
  content:'';position:absolute;left:0;top:9px;bottom:9px;width:2px;background:var(--gold);
  transform:scaleY(0);transform-origin:top;transition:transform .32s var(--ease);
}
.mg:hover{background:rgba(201,163,78,.09)}
.mg:hover::before{transform:scaleY(1)}
.mg svg{width:26px;height:26px;flex-shrink:0;fill:none;stroke:rgba(12,27,42,.52);stroke-width:1.35;stroke-linejoin:round;stroke-linecap:round;transition:stroke .28s var(--ease)}
.mg:hover svg{stroke:var(--gold-dk)}
.mg b{display:block;font-size:13.5px;font-weight:500;line-height:1.32;color:var(--navy);letter-spacing:-.006em}
.mg i{display:block;font-style:normal;margin-top:4px;font-size:10px;font-weight:400;letter-spacing:.16em;text-transform:uppercase;color:rgba(12,27,42,.38)}
.mega-foot{
  display:flex;align-items:center;justify-content:space-between;gap:26px;
  padding:14px 24px;border-top:1px solid var(--line-soft);background:rgba(12,27,42,.032);
}
.mega-foot span{font-size:11px;font-weight:400;letter-spacing:.13em;text-transform:uppercase;color:rgba(12,27,42,.42)}
.mega-foot a{
  display:inline-flex;align-items:center;gap:9px;white-space:nowrap;
  font-size:11px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--navy);
  border-bottom:1.5px solid var(--gold);padding-bottom:4px;
  transition:gap .3s var(--ease),color .3s var(--ease);
}
.mega-foot a:hover{color:var(--gold-dk);gap:15px}
.mega-foot a svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2}

.nav-right{justify-self:end;display:flex;align-items:center;gap:8px}
.icon-btn{width:38px;height:38px;display:grid;place-items:center;border:1px solid transparent;transition:border-color .28s var(--ease),background .28s var(--ease)}
.icon-btn:hover{border-color:var(--line);background:rgba(255,255,255,.45)}
.icon-btn svg{width:17px;height:17px;stroke:var(--navy);fill:none;stroke-width:1.8}

.lang{position:relative}
.lang-btn{display:flex;align-items:center;gap:7px;padding:9px 12px;font-size:12px;font-weight:600;letter-spacing:.11em;border:1px solid var(--line);transition:background .28s var(--ease),border-color .28s var(--ease)}
.lang-btn:hover{background:rgba(255,255,255,.55);border-color:rgba(12,27,42,.3)}
.lang-btn .caret{opacity:.6}
.lang-menu{
  position:absolute;top:calc(100% + 6px);right:0;min-width:112px;
  background:var(--cream);border:1px solid var(--line);
  opacity:0;visibility:hidden;transform:translateY(-5px);
  box-shadow:0 22px 44px -26px rgba(12,27,42,.55);
  transition:opacity .25s var(--ease),transform .25s var(--ease),visibility .25s;
}
.lang.open .lang-menu{opacity:1;visibility:visible;transform:translateY(0)}
.lang-menu a{display:block;padding:11px 14px;font-size:12.5px;font-weight:500;letter-spacing:.06em;border-bottom:1px solid var(--line-soft);transition:background .22s var(--ease),padding-left .22s var(--ease)}
.lang-menu a:last-child{border-bottom:none}
.lang-menu a:hover{background:rgba(201,163,78,.12);padding-left:19px}
.lang-menu a.on{color:var(--gold-dk);font-weight:700}

/* çizgi aralığı `gap` ile veriliyor; X'e dönüşteki kayma miktarı da buradan hesaplanıyor
   (gap 5px + çizgi 1.8px = 6.8px). Eskiden sabit 5px'ti ve kollar üst üste binmiyordu. */
.burger{
  display:none;width:44px;height:44px;cursor:pointer;background:transparent;
  border:1px solid var(--line);
  flex-direction:column;align-items:center;justify-content:center;gap:5px;
  transition:border-color .28s var(--ease),background .28s var(--ease);
}
.burger:hover{border-color:rgba(12,27,42,.3);background:rgba(255,255,255,.45)}
.burger span{display:block;width:20px;height:1.8px;background:var(--navy);transition:transform .32s var(--ease),opacity .22s var(--ease)}
.burger.open span:nth-child(1){transform:translateY(6.8px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-6.8px) rotate(-45deg)}

/* ═══════════ SOL ALT METİN — iki sahnede aynı yerde ═══════════ */
.copy-wrap{position:relative;z-index:20;flex:1;display:flex;align-items:flex-end;padding:0 var(--kenar) 58px}
.copy-slot{position:relative;width:min(560px,52vw);min-height:250px}
.copy{
  position:absolute;left:0;bottom:0;width:100%;
  opacity:0;transform:translateY(22px);pointer-events:none;
  transition:opacity .6s var(--ease),transform .6s var(--ease);
}
.copy.on{opacity:1;transform:translateY(0);pointer-events:auto}
.copy h1,.copy h2{
  font-family:var(--font-display);
  font-weight:500;font-size:clamp(1.9rem,3.3vw,2.95rem);
  line-height:1.14;letter-spacing:-.022em;color:var(--navy);
}
.copy em{font-style:normal;color:var(--gold-dk)}
/* açıklama metni STANDARDI: 15.5px / 300 / satır aralığı 1.74 */
.copy .lead{
  margin-top:20px;padding-left:20px;border-left:2px solid var(--gold);
  font-size:15.5px;font-weight:300;line-height:1.74;color:rgba(12,27,42,.7);max-width:472px;
}
.copy-link{
  display:inline-flex;align-items:center;gap:10px;margin-top:26px;
  font-size:11.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--navy);
  border-bottom:1.5px solid var(--gold);padding-bottom:5px;
  transition:color .3s var(--ease),gap .3s var(--ease);
}
.copy-link:hover{color:var(--gold-dk);gap:16px}
.copy-link svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2}

/* modlar satırı — sadece 2. sahnede */
.modes-row{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:28px;max-width:472px}
.modes-row span{
  padding-top:13px;position:relative;
  border-top:1.5px solid var(--line);
  font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgba(12,27,42,.66);
}
.modes-row span::before{
  content:'';position:absolute;top:-1.5px;left:0;width:0;height:1.5px;
  background:var(--gold);transition:width .65s var(--ease) var(--dl,0s);
}
.copy.on .modes-row span::before{width:100%}
.modes-row span:nth-child(2){--dl:.13s}
.modes-row span:nth-child(3){--dl:.26s}

/* ═══════════ TANITIM BÖLÜMÜ — gerçekçi tır ═══════════ */
/* alt boşluk bilerek geniş: iki bölüm birbirine yapışık görünmesin */
.intro{position:relative;z-index:1;background:var(--cream);overflow:hidden;padding:0 0 138px}
/* arka plandaki ince altın çizgiler */
.intro-lines{
  position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;
  /* Emons'taki gibi: hareler metne yaklaşırken eriyip kaybolsun */
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 44%,rgba(0,0,0,.55) 60%,rgba(0,0,0,.12) 72%,transparent 80%);
  mask-image:linear-gradient(180deg,#000 0%,#000 44%,rgba(0,0,0,.55) 60%,rgba(0,0,0,.12) 72%,transparent 80%);
}
.intro-lines svg{position:absolute;stroke:var(--gold);fill:none}
/* hareler tırın bulunduğu üst bölgede toplanır */
.intro-lines .l1{top:-6%;left:-8%;width:76%;opacity:.55}
.intro-lines .l2{top:-16%;left:-22%;width:112%;opacity:.42}
.intro-lines .l3{top:-26%;right:-14%;width:72%;opacity:.36}
.intro-lines .l4{top:2%;left:-16%;width:86%;opacity:.24}
.intro-lines .x1,.intro-lines .x2,.intro-lines .x3{width:15px;opacity:.5}
.intro-lines .x1{top:9%;left:31%}
.intro-lines .x2{top:31%;left:8%}
.intro-lines .x3{top:17%;right:33%;opacity:.3}

/* tır sağa yaslı, arkası sağ kenardan taşar, sol taraf boş kalır */
/* Emons düzeni: tır sağ yarıda, kabin solda tam görünür, römorkun arkası sağ kenardan taşar */
/* sağa yaslı, römorkun arkası sağ kenardan hafifçe taşar */
.intro-truck{position:relative;z-index:1;width:58%;max-width:none;margin-left:auto;margin-right:-5%}
.intro-truck img{width:100%;height:auto;display:block}

.intro-in{
  position:relative;z-index:2;
  max-width:var(--en);margin:96px auto 0;padding:0 var(--kenar);
  display:grid;grid-template-columns:1.18fr .82fr;gap:64px;align-items:start;
}
/* Emons'un 2. bölümü: sayfanın EN BÜYÜK başlığı burada */
.intro h2{
  font-family:var(--font-display);
  font-weight:400;font-size:clamp(2.2rem,4.9vw,4.55rem);
  line-height:1.14;letter-spacing:-.028em;color:var(--navy);
}
.intro h2 em{font-style:normal;color:var(--gold-dk)}
.intro-side{padding-top:10px}
/* paragraf sütunu doldurup sağ kenara kadar uzansın — Emons'ta da öyle */
.intro-side p{font-size:15.5px;font-weight:300;line-height:1.74;color:rgba(12,27,42,.7)}
.intro-acts{display:flex;flex-wrap:wrap;gap:11px;margin-bottom:26px}
.act{
  display:inline-flex;align-items:center;gap:11px;
  padding:12px 20px;
  border:1px solid var(--line);
  font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--navy);
  transition:background .3s var(--ease),border-color .3s var(--ease),color .3s var(--ease),gap .3s var(--ease);
}
.act svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2}
.act:hover{background:var(--navy);border-color:var(--navy);color:var(--cream);gap:17px}
.act.gold{background:var(--gold);border-color:var(--gold);color:#1B1409}
.act.gold:hover{background:var(--navy);border-color:var(--navy);color:var(--cream)}

/* ═══════════ HİZMETLER ═══════════ */
/* z-index:1 zorunlu — stage sticky olduğu için nav'ın altında kalmasın */
.svc{position:relative;z-index:1;background:var(--cream);padding:0 0 112px}
.svc-in{max-width:var(--en);margin:0 auto;padding:0 var(--kenar)}
.svc-head{display:block}   /* Emons'ta da bu bölümde başlıktan başka bir şey yok */
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:10.5px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-dk)}
.eyebrow::before{content:'';width:6px;height:6px;background:var(--gold)}   /* kare — daire "çip" değil */
/* bir alt kademe: 2. bölümün başlığının ~2/3'ü. Emons'taki hiyerarşi farkı bu. */
.svc h2{
  margin-top:18px;font-family:var(--font-display);
  font-weight:400;font-size:clamp(1.65rem,3.2vw,2.95rem);
  line-height:1.18;letter-spacing:-.022em;color:var(--navy);
}
.svc h2 em{font-style:normal;color:var(--gold-dk)}

/* hücreler arası boşluk krem zemini gösterir — çerçeve yok, Emons'taki gibi */
.svc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:3px}
.svc-wrap{margin-top:54px}
.svc-card{
  position:relative;overflow:hidden;
  background:#E7E3D9;padding:30px 22px 24px;min-height:304px;
  display:flex;flex-direction:column;
  transition:background .42s var(--ease);
}
/* hover'da kart KOYULAŞMAZ, aydınlanır — araç render'ları lacivert olduğu için
   koyu zeminde kayboluyorlardı. Açık altın-krem hem markaya ait hem kontrast veriyor. */
.svc-card:hover{background:#F5EDDC}
.sc-fig{position:relative;flex:1;display:grid;place-items:center;padding:0 0 18px}
/* render görselleri — arka planları _seffaf.py ile silindi, gölgeleri korundu */
.sc-img{position:relative;z-index:1;width:100%;height:auto;transition:transform .5s var(--ease)}

/* Uluslararası hizmetlerin arkasındaki dünya amblemi.
   Render'ın İÇİNDE değil, AYRI KATMAN — üç kartta da birebir aynı görsel olsun diye.
   AI her seferinde farklı bir küre çiziyordu ve yan yana gelince tutarsız duruyordu. */
.svc-card.intl .sc-fig::before{
  content:'';position:absolute;z-index:0;
  left:1%;top:-2%;width:39%;aspect-ratio:1;
  background:url(kure.webp) center/contain no-repeat;   /* yol bu dosyaya göre (assets/) */
  opacity:.5;
  transition:transform .5s var(--ease),opacity .42s var(--ease);
}
.svc-card.intl:hover .sc-fig::before{transform:translateY(-7px);opacity:.72}
.svc-card:hover .sc-img{transform:translateY(-7px)}
.sc-tag{font-size:9.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-dk)}
.sc-name{margin-top:9px;padding-right:24px;font-size:15px;font-weight:500;line-height:1.34;letter-spacing:-.012em;color:var(--navy)}
.sc-go{
  position:absolute;right:22px;bottom:25px;width:15px;height:15px;
  stroke:var(--gold-dk);fill:none;stroke-width:2;
  opacity:0;transform:translateX(-9px);
  transition:opacity .36s var(--ease),transform .36s var(--ease);
}
.svc-card:hover .sc-go{opacity:1;transform:none}
/* alt kenardan dolan altın hat */
.svc-card::after{
  content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--gold);
  transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease);
}
.svc-card:hover::after{transform:scaleX(1)}

/* son hücre — teklif çağrısı */
.svc-cta{background:var(--navy);justify-content:flex-end}
.svc-cta:hover{background:var(--navy-2)}
.svc-cta .sc-tag{color:var(--gold-lt)}
.svc-cta .sc-name{color:var(--cream);padding-right:0;font-size:16.5px}
.cta-go{
  display:inline-flex;align-items:center;gap:10px;margin-top:22px;align-self:flex-start;
  font-size:11px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--gold-lt);
  border-bottom:1.5px solid var(--gold);padding-bottom:5px;transition:gap .3s var(--ease);
}
.svc-cta:hover .cta-go{gap:16px}
.cta-go svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2}

/* gizli grup + "tümünü gör" */
.svc-hidden{max-height:0;overflow:hidden;transition:max-height .62s var(--ease)}
.svc-hidden .svc-grid{margin-top:3px}
.svc-more{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;
  margin-top:3px;padding:21px 26px;background:#E7E3D9;
  color:var(--navy);transition:background .34s var(--ease),color .34s var(--ease);
}
.svc-more:hover{background:var(--navy);color:var(--cream)}
.sm-t{font-size:11.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase}
.sm-r{display:flex;align-items:center;gap:13px;font-size:11px;font-weight:400;letter-spacing:.13em;text-transform:uppercase;opacity:.55}
.sm-r svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2;transition:transform .38s var(--ease)}
.svc-more.acik .sm-r svg{transform:rotate(180deg)}

/* scroll ile beliriş — class'ı JS ekler, JS yoksa hiçbir şey gizlenmez */
.svc-grid.rv-hazir .svc-card{opacity:0;transform:translateY(20px)}
.svc-grid.rv-hazir.rv-ac .svc-card{
  opacity:1;transform:none;
  transition:opacity .7s var(--ease),transform .7s var(--ease);
}
.svc-grid.rv-hazir.rv-ac .svc-card:nth-child(2){transition-delay:.09s}
.svc-grid.rv-hazir.rv-ac .svc-card:nth-child(3){transition-delay:.18s}
.svc-grid.rv-hazir.rv-ac .svc-card:nth-child(4){transition-delay:.27s}

/* ═══════════ HAKKIMIZDA — foto mozaiği ═══════════ */
.about{position:relative;z-index:1;background:var(--cream);padding:0 0 124px}
.about-in{max-width:var(--en);margin:0 auto;padding:0 var(--kenar)}

/* Emons oranları birebir: 3 sütun (177:180:360), 3 satır (117:110:145) */
.mosaic{
  width:58%;margin:32px 0 0 auto;
  display:grid;
  grid-template-columns:177fr 180fr 360fr;
  grid-template-rows:117fr 110fr 145fr;
  gap:3px;aspect-ratio:723/377;
}
.mo-a{grid-column:1;grid-row:1}
.mo-b{grid-column:2;grid-row:1/3}
.mo-c{grid-column:1;grid-row:2}
.mo-d{grid-column:1/3;grid-row:3}
.mo-e{grid-column:3;grid-row:1/4}
/* hücreyi tamamen doldurur, taşan kısım kırpılır — hücre oranları Emons'tan geldiği için
   fotoğrafların kendi oranıyla birebir uyuşması gerekmiyor */
.mo{width:100%;height:100%;object-fit:cover;display:block;background:#E7E3D9}

.about-grid{margin-top:58px;display:grid;grid-template-columns:1.68fr 1fr;gap:100px}
.about-left{display:flex;flex-direction:column;justify-content:space-between}
/* bölüm başlığından bir kademe küçük — cümle uzun olduğu için */
.about h2{
  font-family:var(--font-display);
  font-weight:400;font-size:clamp(1.45rem,2.7vw,2.5rem);
  line-height:1.22;letter-spacing:-.02em;color:var(--navy);
}
.about h2 em{font-style:normal;color:var(--gold-dk)}
.about-acts{display:flex;flex-wrap:wrap;gap:11px;margin-top:52px}
.about-text p{font-size:15.5px;font-weight:300;line-height:1.74;color:rgba(12,27,42,.7)}
.about-text p+p{margin-top:20px}

/* ═══════════ AĞ — Türkiye haritası ═══════════ */
/* Emons'un gri küresinin karşılığı. Üç bağımsız katman: harita (jpg), rota çizgileri (svg),
   metin (html). Böylece rotalar keskin kalıyor ve metin istenildiği gibi yerleştirilebiliyor. */
/* overflow:hidden — mobilde harita taşırılarak büyütülüyor, yan taşma sayfada kaymaya yol açmasın */
.net{position:relative;z-index:1;background:var(--cream);padding:0 0 104px;overflow:hidden}
.net-in{max-width:var(--en);margin:0 auto;padding:0 var(--kenar)}
.net-stage{position:relative;margin-top:22px}
/* rota katmanı bu sarmalayıcıya göre konumlanır (haritanın kendi kutusu).
   Kenarlardaki komşu ülke sınır çizgileri kadrajda aniden kesiliyordu — elips maskeyle
   dört kenar da yumuşakça eriyor, harita zemine oturmuş gibi duruyor. */
.net-map-wrap{
  position:relative;
  -webkit-mask-image:radial-gradient(ellipse 84% 90% at 50% 50%, #000 64%, rgba(0,0,0,.5) 88%, transparent 100%);
  mask-image:radial-gradient(ellipse 84% 90% at 50% 50%, #000 64%, rgba(0,0,0,.5) 88%, transparent 100%);
}
.net-map{width:100%;height:auto;display:block}

.net-lines{position:absolute;inset:0;width:100%;height:100%;fill:none;overflow:visible}
/* açık altın gri relief üstünde kayboluyordu — koyu altın kullanıyoruz */
.net-lines .yol{
  stroke:var(--gold-dk);stroke-width:3;stroke-dasharray:15 11;stroke-linecap:round;
  opacity:.9;
}
.net-lines .yol.ic{stroke-width:2.4;opacity:.7}
.net-lines .nokta{fill:var(--gold-dk);stroke:none}
.net-lines .nokta.buyuk{fill:var(--gold-dk);r:9}

/* metin haritanın üstünde yüzer; arkasına yumuşak krem yıkama koyduk ki relief dokusu
   yazıyı yemesin */
.net-grid{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:34px 0;width:min(900px,84%);
}
/* yıkama iki satırı da kapsayacak kadar geniş olmalı — dar tutulduğunda alt satırın
   açıklama yazıları relief dokusunun içinde kayboluyordu */
.net-grid::before{
  content:'';position:absolute;inset:-46% -14%;z-index:-1;
  background:radial-gradient(56% 54% at 50% 50%, rgba(244,242,237,.97) 0%, rgba(244,242,237,.93) 42%, rgba(244,242,237,.6) 64%, rgba(244,242,237,0) 84%);
}
.ns{padding:0 22px;text-align:center;position:relative}
.ns+.ns::before{
  content:'';position:absolute;left:0;top:12%;bottom:12%;width:1px;
  background:rgba(12,27,42,.2);
}
.ns:nth-child(4)::before{display:none}   /* alt satırın ilk sütunu */
.ns b{
  display:block;font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.1rem,2vw,1.85rem);line-height:1.1;letter-spacing:-.02em;color:var(--navy);
}
.ns i{
  display:block;margin-top:9px;font-style:normal;
  font-size:12px;font-weight:400;line-height:1.5;color:rgba(12,27,42,.74);
}

/* ═══════════ HABERLER — yatay karusel ═══════════ */
.news{position:relative;z-index:1;background:var(--cream);padding:0 0 108px}
.news-in{max-width:var(--en);margin:0 auto;padding:0 var(--kenar)}
.news h2{
  margin-top:18px;font-family:var(--font-display);
  font-weight:400;font-size:clamp(1.65rem,3.2vw,2.95rem);
  line-height:1.18;letter-spacing:-.022em;color:var(--navy);
}
.news h2 em{font-style:normal;color:var(--gold-dk)}
.news-lead{margin-top:20px;font-size:15.5px;font-weight:300;line-height:1.74;color:rgba(12,27,42,.7);max-width:520px}

/* ray: tam genişlik, kartlar sağdan taşar — Emons'ta da öyle */
.news-rail{
  display:flex;gap:2px;margin:44px auto 0;
  max-width:var(--en);                    /* başlıkla aynı hizada başlasın */
  overflow-x:auto;overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;
  padding:0 var(--kenar);
  /* snap noktası padding'i hesaba katmazsa tarayıcı açılışta kaydırıp
     ilk kartı başlık hizasından çıkarıyor */
  scroll-padding-left:var(--kenar);
  scrollbar-width:none;-ms-overflow-style:none;
}
.news-rail::-webkit-scrollbar{display:none}
.nw{
  flex:0 0 clamp(272px,23.5%,368px);scroll-snap-align:start;
  display:flex;flex-direction:column;background:#E7E3D9;
}
.nw-img{position:relative;overflow:hidden;aspect-ratio:16/10}
.nw-img img{
  width:100%;height:100%;object-fit:cover;
  filter:saturate(.55);
  transition:transform .8s var(--ease),filter .55s var(--ease);
}
/* "hafif tema buğusu" — Emons'taki komple kırmızı kaplamanın yumuşak karşılığı.
   Hover'da tamamen kalkıyor, fotoğraf netleşiyor. */
.nw-img::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg, rgba(12,27,42,.3) 0%, rgba(12,27,42,.46) 100%);
  transition:opacity .55s var(--ease);
}
.nw:hover .nw-img::after{opacity:0}
.nw:hover .nw-img img{transform:scale(1.055);filter:saturate(1)}
.nw-date{
  position:absolute;left:0;bottom:0;z-index:2;
  padding:7px 13px;background:var(--gold);color:#1B1409;
  font-size:10.5px;font-weight:600;letter-spacing:.1em;
}
.nw-body{flex:1;display:flex;flex-direction:column;padding:24px 22px 22px}
.nw-body h3{
  font-family:var(--font-display);font-weight:500;
  font-size:16.5px;line-height:1.36;letter-spacing:-.012em;color:var(--navy);
}
.nw-link{
  display:inline-flex;align-items:center;gap:10px;margin-top:auto;padding-top:26px;
  font-size:11px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--navy);
  transition:gap .3s var(--ease),color .3s var(--ease);
}
.nw:hover .nw-link{gap:16px;color:var(--gold-dk)}
.nw-link svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2}

/* alt kumanda */
.news-foot{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:30px}
.news-dots{display:flex;gap:8px}
.news-dots i{
  width:7px;height:7px;background:rgba(12,27,42,.2);
  transition:background .3s var(--ease),width .3s var(--ease);
}
.news-dots i.on{background:var(--gold-dk);width:20px}
.news-nav{display:flex;gap:9px}
.news-nav button{
  display:inline-flex;align-items:center;gap:10px;
  padding:11px 18px;border:1px solid var(--line);
  font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--navy);
  transition:background .3s var(--ease),border-color .3s var(--ease),color .3s var(--ease),opacity .3s var(--ease);
}
.news-nav button:hover:not(:disabled){background:var(--navy);border-color:var(--navy);color:var(--cream)}
.news-nav button:disabled{opacity:.32;cursor:default}
.news-nav svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2}

/* ═══════════ TEKLİF ŞERİDİ ═══════════ */
/* sitedeki tüm #teklif bağlantılarının hedefi burası */
.cta{position:relative;z-index:1;background:var(--cream)}
.cta-in{
  max-width:var(--en);margin:0 auto;padding:54px var(--kenar) 76px;
  border-top:1px solid var(--line);        /* alt ayrımı koyu footer zaten yapıyor */
  display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center;
}
.cta h2{
  font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.5rem,2.9vw,2.6rem);line-height:1.18;letter-spacing:-.022em;color:var(--navy);
}
.cta h2 em{font-style:normal;color:var(--gold-dk)}
.cta p{margin-top:16px;font-size:15.5px;font-weight:300;line-height:1.74;color:rgba(12,27,42,.7);max-width:460px}
.cta-acts{display:flex;flex-wrap:wrap;gap:11px;justify-self:end}

/* ═══════════ FOOTER ═══════════ */
.ft{position:relative;z-index:1;background:var(--navy);color:var(--cream);border-top:2px solid var(--gold)}
.ft-in{max-width:var(--en);margin:0 auto;padding:64px var(--kenar)}
.ft-top{display:grid;grid-template-columns:1.5fr 1fr 1.15fr 1fr;gap:52px}
/* logonun yazısı koyu lacivert olduğu için koyu zeminde kayboluyor —
   beyaz silüete çevriliyor, amblem de dahil tek tonda okunur kalıyor */
.ft-logo{
  display:block;height:46px;width:auto;margin-left:-4px;
  filter:brightness(0) invert(1);opacity:.92;
}
.ft-brand p{margin-top:22px;font-size:14.5px;font-weight:300;line-height:1.74;color:rgba(244,242,237,.6);max-width:330px}

.ft-sos{display:flex;gap:9px;margin-top:24px}
.ft-sos a{
  width:38px;height:38px;display:grid;place-items:center;
  border:1px solid rgba(244,242,237,.2);color:rgba(244,242,237,.7);
  transition:border-color .28s var(--ease),color .28s var(--ease),background .28s var(--ease);
}
.ft-sos a:hover{border-color:var(--gold);color:var(--gold-lt);background:rgba(201,163,78,.1)}
.ft-sos svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6}
.ft-col h3{
  font-size:10.5px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;
  color:var(--gold);margin-bottom:18px;
}
.ft-col a,.ft-col span{
  display:block;padding:7px 0;font-size:14px;font-weight:300;color:rgba(244,242,237,.72);
  transition:color .26s var(--ease),padding-left .26s var(--ease);
}
.ft-col a:hover{color:var(--gold-lt);padding-left:7px}
.ft-lbl{
  display:block;margin:16px 0 2px;font-size:9.5px;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:rgba(244,242,237,.34);
}
.ft-col h3+.ft-lbl{margin-top:0}
.ft-tel{font-family:var(--font-display);font-size:16.5px!important;font-weight:500!important;color:var(--gold-lt)!important;letter-spacing:.01em}

.ft-alt{
  display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;
  padding-top:26px;padding-bottom:30px;border-top:1px solid rgba(244,242,237,.13);
}
.ft-alt span{font-size:12px;font-weight:300;color:rgba(244,242,237,.45)}
.ft-lang{display:flex;gap:6px}
.ft-lang a{
  padding:7px 13px;border:1px solid rgba(244,242,237,.18);
  font-size:11px;font-weight:600;letter-spacing:.12em;color:rgba(244,242,237,.65);
  transition:background .26s var(--ease),color .26s var(--ease),border-color .26s var(--ease);
}
.ft-lang a:hover{border-color:var(--gold);color:var(--gold-lt)}
.ft-lang a.on{background:var(--gold);border-color:var(--gold);color:#1B1409}

/* ═══════════ ARAMA ═══════════ */
/* tam ekran kaplamak yerine ortada açılan kutu */
.search{
  position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:24px;
  background:rgba(12,27,42,.45);backdrop-filter:blur(5px);
  opacity:0;visibility:hidden;transition:opacity .3s var(--ease),visibility .3s;
}
.search.open{opacity:1;visibility:visible}
.search-box{
  width:min(560px,100%);background:var(--cream);
  border:1px solid var(--line);border-top:2px solid var(--gold);
  box-shadow:0 44px 96px -44px rgba(12,27,42,.7), 0 6px 20px -12px rgba(12,27,42,.3);
  transform:translateY(16px) scale(.97);
  transition:transform .42s var(--ease);
}
.search.open .search-box{transform:none}
.search-row{display:flex;align-items:center;gap:14px;padding:18px 18px 18px 20px}
.search-row>svg{width:19px;height:19px;stroke:var(--gold-dk);fill:none;stroke-width:1.9;flex-shrink:0}
.search input{
  flex:1;min-width:0;background:transparent;border:none;padding:6px 0;
  font-family:var(--font-body);font-size:16.5px;font-weight:400;color:var(--navy);outline:none;
}
.search input::placeholder{color:rgba(12,27,42,.36)}
.search-close{width:34px;height:34px;display:grid;place-items:center;flex-shrink:0;border:1px solid transparent;transition:border-color .26s var(--ease),background .26s var(--ease)}
.search-close:hover{border-color:var(--line);background:rgba(255,255,255,.5)}
.search-close svg{width:16px;height:16px;stroke:var(--navy);fill:none;stroke-width:1.9}
.search-hint{
  padding:11px 20px;border-top:1px solid var(--line-soft);background:rgba(12,27,42,.03);
  font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:rgba(12,27,42,.42);
}

/* ═══════════ MOBİL MENÜ ═══════════ */
/* padding nav ile aynı (--kenar) ki menü açılınca logo yerinden oynamasın */
.mm{position:fixed;inset:0;z-index:80;background:var(--cream);padding:16px var(--kenar) 42px;overflow-y:auto;transform:translateX(100%);transition:transform .42s var(--ease)}
.mm.open{transform:translateX(0)}
.mm-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}
.mm-top img{height:46px;margin-left:-11px}
.m-g{border-top:1px solid var(--line)}
.m-h{display:flex;align-items:center;justify-content:space-between;padding:19px 2px;cursor:pointer;font-family:var(--font-display);font-variation-settings:'wdth' 112;font-size:14px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.m-h .caret{width:11px;height:11px}
.m-h.open .caret{transform:rotate(180deg)}
.m-s{max-height:0;overflow:hidden;transition:max-height .4s var(--ease)}
.m-s a{display:flex;align-items:center;gap:14px;padding:14px 2px 14px 4px;font-size:14.5px;line-height:1.35;color:rgba(12,27,42,.72);border-top:1px solid var(--line-soft)}
.m-s a svg{width:23px;height:23px;flex-shrink:0;fill:none;stroke:var(--gold-dk);stroke-width:1.35;stroke-linejoin:round;stroke-linecap:round}
.m-lbl{padding:16px 4px 7px;font-size:10px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:rgba(12,27,42,.36);border-top:1px solid var(--line-soft)}
.m-lbl+a{border-top:none}
.m-lang{display:flex;gap:8px;margin-top:26px}
.m-lang a{flex:1;text-align:center;padding:13px;border:1px solid var(--line);font-size:12px;font-weight:600;letter-spacing:.12em}
.m-lang a.on{background:var(--navy);color:var(--cream);border-color:var(--navy)}

/* ═══════════ GİRİŞ ANİMASYONU ═══════════ */
.rv{opacity:0;transform:translateY(18px);animation:rise .85s var(--ease) forwards}
@keyframes rise{to{opacity:1;transform:translateY(0)}}
.d1{animation-delay:.1s}.d2{animation-delay:.24s}.d3{animation-delay:.38s}

/* ═══════════ RESPONSIVE ═══════════ */
@media (max-width:1280px){
  :root{--kenar:30px}          /* nav, hero ve tüm bölümler birlikte daralır */
  .nav{padding:20px var(--kenar)}
  .nav-links{gap:22px}
  .copy-wrap{padding:0 var(--kenar) 48px}
  .stage-dots{right:30px;bottom:48px}
  .intro-in{gap:48px}
  .about-grid{gap:64px}
  .mosaic{width:68%}
  .ft-top{grid-template-columns:1.3fr 1fr 1.15fr 1fr;gap:36px}
  .cta-in{gap:36px}
  .mega.two .mega-grid{grid-template-columns:repeat(2,minmax(244px,1fr))}
  .svc-card{min-height:264px;padding:28px 20px 22px}
}
@media (max-width:1080px){
  .nav{grid-template-columns:auto 1fr}
  .nav-links{display:none}
  .burger{display:flex}
  .brand img{height:46px}
  .copy-slot{width:min(560px,72vw)}
  .svc-grid{grid-template-columns:repeat(2,1fr)}
  .mosaic{width:100%;margin-top:26px}
  .about-grid{grid-template-columns:1fr;gap:34px;margin-top:44px}
  .about-acts{margin-top:30px}
}
@media (max-width:860px){
  :root{--kenar:22px}
  .stage{height:168vh}
  .scene img{object-position:center top}
  /* gölge modelin altından başlasın — sahne yarıya kadar tamamen açık kalır */
  .scenes::after{
    background:linear-gradient(180deg, rgba(244,242,237,.78) 0%, rgba(244,242,237,0) 9%, rgba(244,242,237,0) 54%, rgba(244,242,237,.72) 65%, rgba(244,242,237,.97) 73%, var(--cream) 80%);
  }
  .copy-wrap{padding:0 var(--kenar) 34px}
  .copy-slot{width:100%;min-height:238px}
  .copy h1,.copy h2{font-size:clamp(1.6rem,7vw,2.15rem)}
  .copy .lead{font-size:14.5px;line-height:1.74;margin-top:16px;padding-left:16px}
  .copy-link{margin-top:20px}
  .modes-row{margin-top:22px;gap:12px;max-width:none}
  .modes-row span{font-size:10px;letter-spacing:.09em;padding-top:11px}
  .nav{padding:16px var(--kenar)}
  .nav.stuck{padding:10px var(--kenar)}
  .brand img{margin-left:-11px}      /* mobilde daha sola */

  /* Emons mobil düzeni: tır üstte sağa taşar, altında başlık → metin → butonlar */
  .intro-truck{width:104%;max-width:none;margin-left:auto;margin-right:-12%;padding-left:0;margin-top:14px}
  /* Emons'ta tırdan sonra geniş bir nefes var, hareler orada görünür */
  .intro-in{grid-template-columns:1fr;gap:0;padding:0 var(--kenar);margin-top:104px;align-items:start}
  .intro h2{font-size:clamp(2rem,8.4vw,2.75rem);line-height:1.18}
  .intro-side{padding-top:0;display:flex;flex-direction:column}
  .intro-side p{font-size:14.5px;line-height:1.74;max-width:none;order:1;margin-top:20px}
  .intro-acts{order:2;margin:26px 0 0;flex-direction:column;align-items:stretch;gap:10px}
  .act{justify-content:space-between;padding:15px 20px}
  .intro-lines{
    -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 34%,rgba(0,0,0,.5) 48%,rgba(0,0,0,.1) 60%,transparent 68%);
    mask-image:linear-gradient(180deg,#000 0%,#000 34%,rgba(0,0,0,.5) 48%,rgba(0,0,0,.1) 60%,transparent 68%);
  }
  .intro-lines .l1{width:150%;left:-34%;top:-3%}
  .intro-lines .l2{width:180%;left:-58%;top:-6%}
  .intro-lines .l3{display:none}
  .intro-lines .l4{width:146%;left:-32%;top:4%}
  .intro-lines .x3{display:none}
  .intro-lines .x1{left:11%;top:11%}
  .intro-lines .x2{left:76%;top:28%}

  /* hizmetler — mobilde iki sütun, kartlar alçalır */
  .intro{padding-bottom:96px}
  .svc{padding-bottom:72px}
  .svc h2{font-size:clamp(1.5rem,6vw,1.95rem);line-height:1.24;margin-top:14px}
  .svc-wrap{margin-top:36px}
  .svc-card{min-height:212px;padding:20px 15px 17px}
  .sc-fig{padding-bottom:14px}
  .sc-name{font-size:13px;margin-top:7px;padding-right:0}
  .sc-tag{font-size:9px;letter-spacing:.16em}
  .sc-go{display:none}
  .svc-cta{padding:22px 16px}
  .svc-cta .sc-name{font-size:14px}
  .cta-go{margin-top:16px;font-size:10px}
  .svc-more{padding:17px 18px}
  .sm-t{font-size:10.5px;letter-spacing:.13em}
  .sm-r span{display:none}

  /* hakkımızda — mozaik tam genişlik, altında başlık → metin → butonlar */
  .about{padding-bottom:76px}
  /* display:contents ile h2 ve butonlar doğrudan flex öğesi olur, sıra değiştirilebilir */
  .about-grid{display:flex;flex-direction:column;gap:0}
  .about-left{display:contents}
  .about h2{order:1}
  .about-text{order:2;margin-top:22px}
  .about-acts{order:3}
  .about h2{font-size:clamp(1.4rem,5.6vw,1.85rem);line-height:1.26}
  .about-text p{font-size:14.5px}
  .about-acts{flex-direction:column;align-items:stretch;gap:10px;margin-top:26px}
  .about-acts .act{justify-content:space-between;padding:15px 20px}

  /* ağ — metin mobilde de haritanın ÜSTÜNDE kalır.
     390px'te harita 218px yüksekliğe düşüp metne yer kalmıyordu; harita taşırılarak
     büyütülüyor (yanları kadraj dışına çıkıyor, Anadolu'nun tamamı görünmeye devam ediyor). */
  .net{padding-bottom:64px}
  .net-map-wrap{width:118%;margin-left:-9%}
  .net-grid{width:94%;grid-template-columns:repeat(2,1fr);gap:11px 0}
  .net-grid::before{
    inset:-34% -20%;
    background:radial-gradient(58% 56% at 50% 50%, rgba(244,242,237,.97) 0%, rgba(244,242,237,.94) 46%, rgba(244,242,237,.62) 68%, rgba(244,242,237,0) 88%);
  }
  .ns{padding:0 8px}
  .ns:nth-child(odd)::before{display:none}
  .ns:nth-child(4)::before{display:block}
  .ns b{font-size:13.5px;line-height:1.16}
  .ns i{font-size:8.5px;margin-top:4px;line-height:1.38}
  .net-lines .yol{stroke-width:4.5}
  .net-lines .yol.ic{stroke-width:3.8}

  /* haberler — mobilde parmakla kaydırma; sonraki kartın ucu görünsün diye %78 */
  .news{padding-bottom:70px}
  .news h2{font-size:clamp(1.5rem,6vw,1.95rem);margin-top:14px}
  .news-lead{font-size:14.5px;margin-top:16px}
  .news-rail{margin-top:30px;gap:10px}
  .nw{flex:0 0 78%}
  .nw-body{padding:20px 18px 18px}
  .nw-body h3{font-size:15px}
  .nw-link{padding-top:20px;font-size:10px}
  .news-foot{margin-top:22px}
  .news-nav button{padding:10px 14px;font-size:10px;letter-spacing:.1em}

  /* teklif + footer */
  .cta-in{grid-template-columns:1fr;gap:28px;padding:40px var(--kenar) 52px}
  .cta h2{font-size:clamp(1.45rem,5.8vw,1.9rem)}
  .cta p{font-size:14.5px;max-width:none}
  .cta-acts{justify-self:start;flex-direction:column;align-items:stretch;width:100%;gap:10px}
  .cta-acts .act{justify-content:space-between;padding:15px 20px}
  .act.wa{justify-content:center;gap:12px}

  .ft-in{padding:46px var(--kenar)}
  .ft-top{grid-template-columns:1fr;gap:34px}
  .ft-brand p{max-width:none;margin-top:16px}
  .ft-alt{padding-top:22px;padding-bottom:26px}
}
@media (max-width:420px){
  .brand img{height:40px}
  .lang-btn{padding:8px 9px;font-size:11px}
  .modes-row{gap:9px}
  .modes-row span{font-size:9px;letter-spacing:.05em}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0ms!important;transition-duration:.01ms!important}
}

/* ═══════════════════════════════════════════
   HİZMET ALT SAYFASI HERO'SU  (.shero)
   Emons'un hizmet sayfası düzeni: boydan boya gerçekçi görsel, sol altta
   breadcrumb + dev başlık, en altta ince çizgiyle ayrılmış bilgi şeridi.
   Tüm hizmet sayfaları bu bloğu paylaşır; değişen tek şey görsel ve metin.
   ═══════════════════════════════════════════ */
.shero{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden}
.shero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:58% 50%}
/* metin okunurluğu: alttan yukarı koyu yıkama + üstte nav için hafif bant */
.shero::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(0deg, rgba(8,17,27,.88) 0%, rgba(8,17,27,.62) 26%, rgba(8,17,27,.12) 52%, rgba(8,17,27,0) 70%),
    linear-gradient(180deg, rgba(8,17,27,.5) 0%, rgba(8,17,27,0) 18%);
}
.shero-in{position:relative;z-index:2;max-width:var(--en);width:100%;margin:0 auto;padding:0 var(--kenar) 46px}

.crumb{display:flex;align-items:center;gap:11px;margin-bottom:22px;font-size:12.5px;font-weight:300;color:rgba(244,242,237,.62)}
.crumb a{transition:color .26s var(--ease)}
.crumb a:hover{color:var(--gold-lt)}
.crumb i{font-style:normal;opacity:.42}
.crumb b{font-weight:400;color:rgba(244,242,237,.9)}

.shero h1{
  font-family:var(--font-display);font-weight:400;
  font-size:clamp(2rem,4.6vw,4.15rem);line-height:1.1;letter-spacing:-.028em;
  color:#fff;max-width:16ch;
}

/* alt bilgi şeridi */
.shero-foot{
  position:relative;z-index:2;border-top:1px solid rgba(244,242,237,.22);
}
.shero-foot-in{
  max-width:var(--en);margin:0 auto;padding:26px var(--kenar) 34px;
  display:grid;grid-template-columns:auto auto 1fr;gap:52px;align-items:start;
}
.shero-jump{
  display:inline-flex;align-items:center;gap:11px;white-space:nowrap;
  font-size:12.5px;font-weight:400;color:rgba(244,242,237,.86);
  transition:color .28s var(--ease),gap .28s var(--ease);
}
.shero-jump:hover{color:var(--gold-lt);gap:16px}
.shero-jump svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.9}
.shero-tag{
  display:inline-flex;align-items:center;gap:9px;white-space:nowrap;
  font-size:12.5px;font-weight:400;color:rgba(244,242,237,.86);
}
.shero-tag::before{content:'';width:7px;height:7px;background:var(--gold);flex-shrink:0}
.shero-foot p{
  font-size:14.5px;font-weight:300;line-height:1.72;color:rgba(244,242,237,.82);max-width:640px;
}

@media (max-width:1080px){
  .shero-foot-in{grid-template-columns:auto auto;gap:20px 34px}
  .shero-foot p{grid-column:1/-1;max-width:none}
}
@media (max-width:860px){
  .shero{min-height:92svh}
  .shero-bg{object-position:66% 50%}
  .shero-in{padding-bottom:34px}
  .shero h1{font-size:clamp(1.75rem,8vw,2.5rem);max-width:none}
  .crumb{font-size:11px;gap:8px;margin-bottom:16px;flex-wrap:wrap}
  .shero-foot-in{grid-template-columns:1fr;gap:14px;padding:20px var(--kenar) 26px}
  .shero-foot p{font-size:13.5px;line-height:1.68}
}

/* ——— koyu hero üzerindeki nav (hizmet sayfaları) ———
   Alt sayfalarda hero koyu bir fotoğraf; lacivert nav yazıları okunmuyordu.
   `.ters` sınıfı yalnızca sayfa tepesindeyken beyaz varyanta geçirir,
   scroll edilip `.stuck` gelince normal krem nav'a döner. */
.nav.ters:not(.stuck) .nav-link,
.nav.ters:not(.stuck) .lang-btn{color:#fff}
.nav.ters:not(.stuck) .nav-link.on{color:var(--gold-lt)}
.nav.ters:not(.stuck) .nav-link.on::after{background:var(--gold-lt)}
.nav.ters:not(.stuck) .icon-btn svg{stroke:#fff}
.nav.ters:not(.stuck) .icon-btn:hover{border-color:rgba(255,255,255,.32);background:rgba(255,255,255,.08)}
.nav.ters:not(.stuck) .lang-btn{border-color:rgba(255,255,255,.3)}
.nav.ters:not(.stuck) .lang-btn:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.5)}
.nav.ters:not(.stuck) .burger{border-color:rgba(255,255,255,.3)}
.nav.ters:not(.stuck) .burger:hover{border-color:rgba(255,255,255,.55);background:rgba(255,255,255,.08)}
.nav.ters:not(.stuck) .burger span{background:#fff}
/* logo kendi renginde kalır (kullanıcı beyazlatılmasını istemedi); okunurluğu
   hero'nun üst kısmındaki koyu bant sağlıyor */

/* ═══════════ HİZMET DETAY BÖLÜMÜ (.det) ═══════════
   Emons'un "kapsam listesi" bölümünün karşılığı. Emons'ta solda küçük bir fotoğraf,
   sağda 10 madde vardı ve denge bozuktu; burada fotoğraf sütunu dolduruyor ve
   madde sayısı gerçekçi tutuluyor (firma yeni, abartılı vaat yok). */
.det{position:relative;z-index:1;background:var(--cream);padding:104px 0 112px}
/* İki satırlı ızgara: başlık üst satırda tek başına, fotoğraf ile madde listesi alt satırda.
   Böylece liste `align-self:center` ile FOTOĞRAFIN dikey merkezine hizalanır — tek satır
   olsaydı listenin üstte asılı kalıp fotoğrafın altta uzamasını engelleyemezdik. */
.det-in{
  max-width:var(--en);margin:0 auto;padding:0 var(--kenar);
  display:grid;grid-template-columns:1fr 1.1fr;grid-template-rows:auto 1fr;
  column-gap:80px;align-items:start;
}
.det h2{grid-column:1;grid-row:1}
.det-foto{grid-column:1;grid-row:2}
.det-liste{grid-column:2;grid-row:2;align-self:center}
.det h2{
  font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.55rem,3vw,2.7rem);line-height:1.18;letter-spacing:-.022em;color:var(--navy);
}
.det h2 em{font-style:normal;color:var(--gold-dk)}
/* yükseklik sınırı: fotoğraf sütunu ile madde listesinin boyu birbirine yakın kalsın */
.det-foto{width:100%;height:auto;max-height:440px;object-fit:cover;margin-top:36px;display:block}

.det-liste{list-style:none;border-top:1px solid var(--line)}
.det-liste li{border-bottom:1px solid var(--line)}
.det-liste li>span{
  display:flex;align-items:center;justify-content:space-between;gap:30px;
  padding:26px 14px 26px 4px;
  transition:background .3s var(--ease),padding-left .3s var(--ease);
}
.det-liste li:hover>span{background:rgba(201,163,78,.075);padding-left:14px}
.det-liste b{font-size:15.5px;font-weight:300;line-height:1.6;color:rgba(12,27,42,.82)}
.det-liste li:hover b{color:var(--navy)}
/* daire içinde ikon "AI komponenti" görünüyor — sade, keskin bir onay işareti */
.det-liste svg{
  width:18px;height:18px;flex-shrink:0;fill:none;stroke:var(--gold-dk);
  stroke-width:2;stroke-linecap:round;stroke-linejoin:round;
  opacity:.82;transition:opacity .3s var(--ease),transform .3s var(--ease);
}
.det-liste li:hover svg{opacity:1;transform:scale(1.12)}

@media (max-width:1080px){
  .det{padding:76px 0 84px}
  /* tek sütun: başlık → fotoğraf → liste, ortalamaya gerek kalmaz */
  .det-in{grid-template-columns:1fr;grid-template-rows:auto auto auto}
  .det h2,.det-foto,.det-liste{grid-column:1}
  .det h2{grid-row:1}
  .det-foto{grid-row:2;margin-top:26px}
  .det-liste{grid-row:3;align-self:start;margin-top:34px}
}
@media (max-width:860px){
  .det{padding:60px 0 68px}
  .det-liste li>span{padding:17px 10px 17px 2px;gap:20px}
  .det-liste b{font-size:14.5px}
  .det-liste svg{width:16px;height:16px}
}

/* ═══════════ SÜREÇ YOLU (.yol) ═══════════
   Emons'un kesikli çizgiyle akan bölümünün karşılığı. Ortadan hafif kıvrımlı, kesikli
   bir "yol" geçer; adımlar sağ-sol dönüşümlü dizilir ve her adımın hizasında yolun
   üstünde altın bir işaret durur. Emons'ta bloklar tamamen metindi; burada bir tarafta
   daima FOTOĞRAF var (kullanıcı isteği), diğer tarafta anlatım. */
.yol{position:relative;z-index:1;background:var(--cream);padding:8px 0 118px;overflow:hidden}
.yol-in{position:relative;max-width:var(--en);margin:0 auto;padding:0 var(--kenar)}
.yol-bas{max-width:620px;margin-bottom:26px}
.yol-bas h2{
  margin-top:18px;font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.55rem,3vw,2.7rem);line-height:1.18;letter-spacing:-.022em;color:var(--navy);
}
.yol-bas h2 em{font-style:normal;color:var(--gold-dk)}

/* Kesikli yol — adımların arkasından geçer.
   ⚠️ Önce kıvrımlı bir SVG path'ti; işaret kareleri `left:50%` sabit olduğu için çizgi
   kıvrıldıkça bir sağa bir sola kaçıyordu. Kıvrımlı çizgi + sabit konumlu işaret
   MATEMATİKSEL OLARAK hizalanamaz (bölüm yüksekliği değiştikçe kesişim noktası kayar).
   Çizgi düz yapıldı: hem çizgi hem kareler tam %50'de, her ekranda birebir oturuyor. */
.yol-adimlar{position:relative}
.yol-adimlar::before{
  content:'';position:absolute;left:50%;top:0;bottom:0;width:1.6px;margin-left:-.8px;z-index:0;
  background:repeating-linear-gradient(180deg,
    rgba(12,27,42,.28) 0 7px, rgba(12,27,42,0) 7px 17px);
}

.adim{
  position:relative;z-index:1;
  display:grid;grid-template-columns:1fr 1fr;gap:104px;align-items:center;
  padding:56px 0;
}
.adim.ters .adim-foto{order:2}          /* çift sıradaki adımda fotoğraf sağa geçer */
/* yolun üstündeki işaret — daire değil, keskin kare (site dili) */
.adim::before{
  content:'';position:absolute;left:50%;top:50%;
  width:11px;height:11px;margin:-5.5px 0 0 -5.5px;
  background:var(--gold);box-shadow:0 0 0 7px var(--cream);
}

/* fotoğraf: çerçeveli kart, katmanlı düşük opasiteli gölge */
.adim-foto{
  background:#fff;padding:13px;
  box-shadow:0 36px 68px -36px rgba(12,27,42,.42), 0 6px 18px -10px rgba(12,27,42,.16);
  transition:transform .55s var(--ease),box-shadow .55s var(--ease);
}
.adim-foto:hover{
  transform:translateY(-7px);
  box-shadow:0 46px 84px -38px rgba(12,27,42,.5), 0 8px 22px -12px rgba(12,27,42,.2);
}
.adim-foto img{width:100%;height:auto;display:block}

.adim-ust{
  display:inline-flex;align-items:center;gap:10px;
  font-size:10.5px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-dk);
}
.adim-ust::before{content:'';width:6px;height:6px;background:var(--gold)}
.adim h3{
  margin-top:16px;font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.3rem,2.4vw,2.05rem);line-height:1.2;letter-spacing:-.02em;color:var(--navy);
}
.adim p{margin-top:18px;font-size:15.5px;font-weight:300;line-height:1.74;color:rgba(12,27,42,.7);max-width:520px}

@media (max-width:1280px){ .adim{gap:64px} }
@media (max-width:1080px){
  .yol{padding-bottom:82px}
  .yol-adimlar::before{display:none}      /* tek sütunda yol anlamını yitiriyor */
  .adim{grid-template-columns:1fr;gap:26px;padding:30px 0}
  .adim.ters .adim-foto{order:0}
  .adim::before{display:none}
  .adim p{max-width:none}
}
@media (max-width:860px){
  .yol{padding-bottom:64px}
  .yol-bas h2{font-size:clamp(1.5rem,6vw,1.95rem)}
  .adim{padding:24px 0}
  .adim-foto{padding:9px}
  .adim p{font-size:14.5px;margin-top:14px}
  .adim h3{margin-top:12px}
}

/* ═══════════════════════════════════════════
   KURUMSAL SAYFA — HAKKIMIZDA
   Hizmet sayfalarının koyu, tam ekran hero'sunun bilinçli olarak TERSİ:
   krem zeminli editorial açılış (solda dev başlık, sağda giriş paragrafı),
   altında sayfayı boydan boya kesen yatay şerit. Nav'a `ters` VERİLMEZ.
   ═══════════════════════════════════════════ */
.khero{position:relative;z-index:1;background:var(--cream);padding:150px 0 0}
.khero-in{max-width:var(--en);margin:0 auto;padding:0 var(--kenar)}
/* breadcrumb burada krem zemin üstünde — koyu hero varyantının tersi renkler */
.khero .crumb{color:rgba(12,27,42,.48)}
.khero .crumb b{color:rgba(12,27,42,.82)}
.khero .crumb a:hover{color:var(--gold-dk)}

.khero-bas{display:grid;grid-template-columns:1.3fr 1fr;gap:84px;align-items:end}
.khero h1{
  font-family:var(--font-display);font-weight:400;
  font-size:clamp(2.05rem,4.8vw,4.35rem);line-height:1.12;letter-spacing:-.03em;color:var(--navy);
}
.khero h1 em{font-style:normal;color:var(--gold-dk)}
.khero-gir{font-size:15.5px;font-weight:300;line-height:1.74;color:rgba(12,27,42,.7);padding-bottom:10px}

/* tam genişlik şerit — kenar boşluğu yok, sayfayı yatay olarak keser */
.khero-sr{position:relative;margin-top:56px}
.khero-sr img{width:100%;height:clamp(270px,40vw,540px);object-fit:cover;object-position:50% 56%;display:block}
/* şeridin sol alt köşesine binen etiket: krem blok görüntüyü çentikler (ızgarayı bilerek kırar) */
.khero-etk{
  position:absolute;left:0;bottom:0;
  display:flex;align-items:center;gap:15px;
  background:var(--cream);padding:19px 30px 0 var(--kenar);
}
.khero-etk::before{content:'';width:9px;height:9px;background:var(--gold);flex-shrink:0}
.khero-etk b{font-size:13px;font-weight:500;color:var(--navy)}
.khero-etk span{width:1px;height:13px;background:var(--line)}
.khero-etk i{
  font-style:normal;font-size:10.5px;font-weight:600;letter-spacing:.22em;
  text-transform:uppercase;color:var(--gold-dk);
}

/* ═══════════ ANLATI (.man) ═══════════
   Sol sütun scroll boyunca yapışık kalır, sağda uzun metin akar. */
.man{position:relative;z-index:1;background:var(--cream);padding:104px 0 92px}
.man-in{
  max-width:var(--en);margin:0 auto;padding:0 var(--kenar);
  display:grid;grid-template-columns:1fr 1.4fr;gap:100px;align-items:start;
}
.man-sol{position:sticky;top:128px}
.man h2{
  margin-top:18px;font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.55rem,3vw,2.7rem);line-height:1.18;letter-spacing:-.022em;color:var(--navy);
}
.man h2 em{font-style:normal;color:var(--gold-dk)}
.man-metin p{font-size:15.5px;font-weight:300;line-height:1.74;color:rgba(12,27,42,.7)}
.man-metin p+p{margin-top:26px}
/* ilk paragraf giriş cümlesi: bir kademe büyük ve koyu */
.man-metin p:first-child{font-size:17.5px;line-height:1.68;color:rgba(12,27,42,.84)}

/* ═══════════ ÇALIŞMA İLKELERİ (.ilke) ═══════════
   Kart değil: ızgara çizgileriyle bölünmüş dört alan. Her hücrenin üst
   çizgisinde küçük bir altın işaret durur, hover'da çizgiye doğru uzar. */
.ilke{position:relative;z-index:1;background:var(--cream);padding:0 0 102px}
.ilke-in{max-width:var(--en);margin:0 auto;padding:0 var(--kenar)}
.ilke-bas{max-width:660px;margin-bottom:50px}
.ilke-bas h2{
  margin-top:18px;font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.55rem,3vw,2.7rem);line-height:1.18;letter-spacing:-.022em;color:var(--navy);
}
.ilke-bas h2 em{font-style:normal;color:var(--gold-dk)}

.ilke-grid{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line)}
.ik{position:relative;padding:46px 64px 48px 0;border-bottom:1px solid var(--line)}
.ik:nth-child(even){padding:46px 0 48px 64px;border-left:1px solid var(--line)}
.ik::before{
  content:'';position:absolute;top:-1px;left:0;width:10px;height:2px;background:var(--gold);
  transition:width .55s var(--ease);
}
.ik:nth-child(even)::before{left:64px}
.ik:hover::before{width:72px}
.ik b{
  display:block;font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.15rem,1.75vw,1.5rem);line-height:1.24;letter-spacing:-.015em;color:var(--navy);
}
.ik p{margin-top:15px;font-size:15px;font-weight:300;line-height:1.74;color:rgba(12,27,42,.68)}

/* ═══════════ TAAHHÜT BANDI (.soz) ═══════════
   Emons'un rakam bloğunun yerini tutar — firma yeni olduğu için sayı yok,
   verilen sözü anlatan koyu bir duraklama. Sayfanın tek koyu bölümü. */
.soz{position:relative;z-index:1;background:var(--navy);padding:98px 0 100px;overflow:hidden}
/* katmanlı radial dokular + üstte ince altın hat */
.soz::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(72% 108% at 12% 0%, rgba(201,163,78,.16) 0%, rgba(201,163,78,0) 62%),
    radial-gradient(56% 92% at 92% 100%, rgba(30,58,87,.62) 0%, rgba(30,58,87,0) 68%);
}
.soz::after{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--gold)}
.soz-in{position:relative;z-index:1;max-width:var(--en);margin:0 auto;padding:0 var(--kenar)}
.soz .eyebrow{color:var(--gold-lt)}
.soz .eyebrow::before{background:var(--gold-lt)}
.soz h2{
  margin-top:20px;max-width:20ch;
  font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.6rem,3.4vw,3.05rem);line-height:1.16;letter-spacing:-.026em;color:#fff;
}
.soz h2 em{font-style:normal;color:var(--gold-lt)}
.soz-liste{
  display:grid;grid-template-columns:repeat(3,1fr);margin-top:62px;
  border-top:1px solid rgba(244,242,237,.2);
}
.sz{padding:30px 42px 0 0;border-right:1px solid rgba(244,242,237,.13)}
.sz:last-child{border-right:0;padding-right:0}
.sz b{display:block;font-size:15.5px;font-weight:500;color:var(--cream)}
.sz p{margin-top:11px;font-size:14px;font-weight:300;line-height:1.7;color:rgba(244,242,237,.62)}

/* ═══════════ EKİP (.ekip) ═══════════
   İki fotoğraf katmanlı: dikey kare büyük görselin sağ altına biner,
   krem bir pay ile ondan ayrılır. */
.ekip{position:relative;z-index:1;background:var(--cream);padding:104px 0 116px}
.ekip-in{
  max-width:var(--en);margin:0 auto;padding:0 var(--kenar);
  display:grid;grid-template-columns:1.12fr 1fr;gap:96px;align-items:center;
}
.ekip-gorsel{position:relative}
.ekip-gorsel .ana img{
  width:100%;height:auto;display:block;
  box-shadow:0 42px 78px -42px rgba(12,27,42,.44), 0 8px 22px -14px rgba(12,27,42,.16);
}
.ekip-gorsel .kucuk{
  position:absolute;right:-7%;bottom:-10%;width:37%;
  background:var(--cream);padding:13px 0 0 13px;
}
.ekip-gorsel .kucuk img{
  width:100%;height:auto;display:block;
  box-shadow:0 26px 52px -30px rgba(12,27,42,.42);
}
.ekip h2{
  margin-top:18px;font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.55rem,3vw,2.7rem);line-height:1.18;letter-spacing:-.022em;color:var(--navy);
}
.ekip h2 em{font-style:normal;color:var(--gold-dk)}
.ekip-metin p{margin-top:22px;font-size:15.5px;font-weight:300;line-height:1.74;color:rgba(12,27,42,.7)}
.ekip-acts{display:flex;flex-wrap:wrap;gap:11px;margin-top:34px}

@media (max-width:1280px){
  .khero-bas{gap:56px}
  .man-in{gap:64px}
  .ekip-in{gap:60px}
  .ik{padding-right:44px}
  .ik:nth-child(even){padding-left:44px}
  .ik:nth-child(even)::before{left:44px}
}
@media (max-width:1080px){
  .khero{padding-top:126px}
  .khero-bas{grid-template-columns:1fr;gap:28px;align-items:start}
  .khero-gir{padding-bottom:0;max-width:640px}
  .man{padding:80px 0 72px}
  .man-in{grid-template-columns:1fr;gap:34px}
  .man-sol{position:static}
  .ilke{padding-bottom:80px}
  .ilke-grid{grid-template-columns:1fr}
  .ik,.ik:nth-child(even){padding:34px 0 36px;border-left:0}
  .ik:nth-child(even)::before{left:0}
  .soz{padding:78px 0 82px}
  .soz h2{max-width:none}
  .soz-liste{grid-template-columns:1fr;margin-top:40px}
  .sz{padding:24px 0;border-right:0;border-bottom:1px solid rgba(244,242,237,.13)}
  .sz:last-child{border-bottom:0}
  .ekip{padding:80px 0 88px}
  .ekip-in{grid-template-columns:1fr;gap:44px}
  /* katmanlı yerleşim tek sütunda anlamını yitiriyor */
  .ekip-gorsel .kucuk{display:none}
}
@media (max-width:860px){
  .khero{padding-top:112px}
  .khero h1{font-size:clamp(1.75rem,8vw,2.5rem)}
  .khero .crumb{font-size:11px;gap:8px;margin-bottom:16px;flex-wrap:wrap}
  .khero-gir{font-size:14.5px}
  .khero-sr{margin-top:34px}
  .khero-sr img{height:clamp(200px,54vw,300px)}
  .khero-etk{padding:14px 20px 0 var(--kenar);gap:11px}
  .khero-etk b{font-size:12px}
  .khero-etk i{font-size:9.5px;letter-spacing:.16em}
  .man{padding:60px 0 56px}
  .man h2,.ilke-bas h2,.ekip h2{font-size:clamp(1.5rem,6vw,1.95rem)}
  .man-metin p:first-child{font-size:16px}
  .man-metin p{font-size:14.5px}
  .man-metin p+p{margin-top:20px}
  .ilke{padding-bottom:60px}
  .ilke-bas{margin-bottom:34px}
  .ik,.ik:nth-child(even){padding:26px 0 28px}
  .ik p{font-size:14.5px;margin-top:12px}
  .soz{padding:60px 0 64px}
  .soz h2{font-size:clamp(1.5rem,6.2vw,2rem)}
  .soz-liste{margin-top:32px}
  .sz p{font-size:13.5px}
  .ekip{padding:60px 0 68px}
  .ekip-metin p{font-size:14.5px;margin-top:16px}
  .ekip-acts{flex-direction:column;align-items:stretch;gap:10px;margin-top:26px}
  .ekip-acts .act{justify-content:space-between;padding:15px 20px}
}

/* ═══════════════════════════════════════════
   SAYFA BAŞLIĞI — şeritsiz varyant (.khero.sade)
   Vizyon-Misyon ve Haberler sayfaları hero fotoğrafı taşımaz; aynı editorial
   açılışı görselsiz kullanırlar. Hakkımızda ile tipografik olarak aynı hizada.
   ═══════════════════════════════════════════ */
.khero.sade{padding-bottom:56px}
.khero.sade .khero-bas{align-items:start}

/* ═══════════ VİZYON / MİSYON ═══════════
   İki eşit blok yan yana: biri lacivert, biri açık kum. Sert renk kontrastı
   sayfanın omurgası; kart/gölge dili yerine dolu yüzey kullanılıyor. */
.vm{position:relative;z-index:1;background:var(--cream)}
.vm-in{max-width:var(--en);margin:0 auto;padding:0 var(--kenar)}
.vm-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px}
.vmb{position:relative;padding:54px 52px 58px;overflow:hidden}
.vmb.koyu{background:var(--navy)}
.vmb.acik{background:#E7E3D9}
/* üst kenarda dolan altın hat */
.vmb::after{
  content:'';position:absolute;top:0;left:0;width:64px;height:3px;background:var(--gold);
  transition:width .6s var(--ease);
}
.vmb:hover::after{width:190px}
.vmb.koyu::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(78% 100% at 100% 0%, rgba(201,163,78,.14) 0%, rgba(201,163,78,0) 66%);
}
.vmb>*{position:relative;z-index:1}
.vmb h2{
  margin-top:20px;font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.5rem,2.8vw,2.35rem);line-height:1.18;letter-spacing:-.022em;
}
.vmb.koyu h2{color:#fff}
.vmb.acik h2{color:var(--navy)}
.vmb.koyu .eyebrow{color:var(--gold-lt)}
.vmb.koyu .eyebrow::before{background:var(--gold-lt)}
.vmb p{margin-top:24px;font-size:15.5px;font-weight:300;line-height:1.76}
.vmb.koyu p{color:rgba(244,242,237,.74)}
.vmb.acik p{color:rgba(12,27,42,.72)}
.vmb p+p{margin-top:18px}

/* ═══════════ MANİFESTO SATIRI ═══════════
   Tek cümlelik duraklama; solunda altın dikey hat. */
.mnf{position:relative;z-index:1;background:var(--cream);padding:96px 0 98px}
.mnf-in{max-width:var(--en);margin:0 auto;padding:0 var(--kenar)}
.mnf p{
  max-width:26ch;border-left:2px solid var(--gold);padding-left:40px;
  font-family:var(--font-display);font-weight:300;
  font-size:clamp(1.35rem,2.9vw,2.5rem);line-height:1.3;letter-spacing:-.022em;color:var(--navy);
}
.mnf p em{font-style:normal;color:var(--gold-dk)}

/* ═══════════ YAKLAŞIM — üç sütun ═══════════ */
.yak{position:relative;z-index:1;background:var(--cream);padding:0 0 104px}
.yak-in{max-width:var(--en);margin:0 auto;padding:0 var(--kenar)}
.yak-bas{max-width:660px;margin-bottom:48px}
.yak-bas h2{
  margin-top:18px;font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.55rem,3vw,2.7rem);line-height:1.18;letter-spacing:-.022em;color:var(--navy);
}
.yak-bas h2 em{font-style:normal;color:var(--gold-dk)}
.yak-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}
.yk{position:relative;padding:42px 52px 6px 0;border-right:1px solid var(--line)}
.yk+.yk{padding-left:52px}
.yk:last-child{border-right:0;padding-right:0}
.yk::before{
  content:'';position:absolute;top:-1px;left:0;width:10px;height:2px;background:var(--gold);
  transition:width .55s var(--ease);
}
.yk+.yk::before{left:52px}
.yk:hover::before{width:64px}
.yk b{
  display:block;font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.1rem,1.6vw,1.4rem);line-height:1.24;letter-spacing:-.015em;color:var(--navy);
}
.yk p{margin-top:14px;font-size:15px;font-weight:300;line-height:1.74;color:rgba(12,27,42,.68)}

/* ═══════════════════════════════════════════
   HABER LİSTESİ SAYFASI
   Emons'un news sayfasından alınan tek şey fikir: kategori filtresi + kart
   ızgarası. Oradaki dizel/döviz/kereste panelleri ve bülten bloğu alınmadı —
   yeni kurulmuş bir firmada karşılığı yok.
   ═══════════════════════════════════════════ */
.nfilt-wrap{position:relative;z-index:1;background:var(--cream)}
.nfilt-in{max-width:var(--en);margin:0 auto;padding:0 var(--kenar)}
.nfilt{display:flex;flex-wrap:wrap;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.nfilt button{
  position:relative;padding:17px 28px;background:none;border:0;
  border-right:1px solid var(--line);cursor:pointer;
  font-family:inherit;font-size:12.5px;font-weight:400;color:rgba(12,27,42,.6);
  transition:color .3s var(--ease),background .3s var(--ease);
}
.nfilt button::after{
  content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--gold);
  transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease);
}
.nfilt button:hover{color:var(--navy);background:rgba(201,163,78,.07)}
.nfilt button.on{color:var(--navy);font-weight:500}
.nfilt button.on::after{transform:scaleX(1)}

.nlist{position:relative;z-index:1;background:var(--cream);padding:2px 0 104px}
.nlist-in{max-width:var(--en);margin:0 auto;padding:0 var(--kenar)}
.nlist-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px}
/* karusel kartı ızgarada esnemesin */
.nlist-grid .nw{flex:initial;width:auto;scroll-snap-align:none}
.nw[hidden]{display:none}          /* .nw flex olduğu için hidden'ı ayrıca bastırmak şart */
.nw-kat{
  display:inline-flex;align-items:center;gap:8px;margin-bottom:13px;
  font-size:10px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-dk);
}
.nw-kat::before{content:'';width:5px;height:5px;background:var(--gold)}
/* filtre sonucu boşsa */
.nlist-bos{
  display:none;padding:64px 0;font-size:15px;font-weight:300;color:rgba(12,27,42,.6);
  border-bottom:1px solid var(--line);
}
.nlist-bos.on{display:block}

@media (max-width:1280px){
  .vmb{padding:46px 40px 50px}
  .yk{padding-right:40px}
  .yk+.yk{padding-left:40px}
  .yk+.yk::before{left:40px}
}
@media (max-width:1080px){
  .khero.sade{padding-bottom:40px}
  .vm-grid{grid-template-columns:1fr}
  .mnf{padding:72px 0 74px}
  .mnf p{max-width:none;padding-left:30px}
  .yak{padding-bottom:80px}
  .yak-grid{grid-template-columns:1fr}
  .yk,.yk+.yk{padding:32px 0 6px;border-right:0;border-bottom:1px solid var(--line)}
  .yk:last-child{border-bottom:0}
  .yk+.yk::before{left:0}
  .nlist-grid{grid-template-columns:repeat(2,1fr)}
  .nlist{padding-bottom:80px}
}
@media (max-width:860px){
  .vmb{padding:34px 26px 38px}
  .vmb h2{font-size:clamp(1.4rem,5.6vw,1.8rem);margin-top:16px}
  .vmb p{font-size:14.5px;margin-top:18px}
  .mnf{padding:54px 0 56px}
  .mnf p{font-size:clamp(1.2rem,5.4vw,1.6rem);padding-left:22px}
  .yak{padding-bottom:60px}
  .yak-bas{margin-bottom:30px}
  .yak-bas h2{font-size:clamp(1.5rem,6vw,1.95rem)}
  .yk,.yk+.yk{padding:24px 0 6px}
  .yk p{font-size:14.5px;margin-top:11px}
  .nfilt button{padding:14px 18px;font-size:11.5px}
  .nlist-grid{grid-template-columns:1fr}
  .nlist{padding-bottom:64px}
}

/* ═══════════════════════════════════════════
   İLETİŞİM SAYFASI
   Solda iletişim bilgileri + şeffaf maket görseli, sağda teklif formu.
   Form kutuları keskin köşeli, ince çizgili; kapsül alan / yuvarlak buton yok.
   ═══════════════════════════════════════════ */
.ilt{position:relative;z-index:1;background:var(--cream);padding:0 0 112px}
.ilt-in{
  max-width:var(--en);margin:0 auto;padding:0 var(--kenar);
  display:grid;grid-template-columns:.85fr 1.15fr;gap:88px;align-items:start;
}

/* ——— sol sütun: bilgiler ——— */
.ilt-bilgi{border-top:1px solid var(--line)}
.ib{padding:26px 0;border-bottom:1px solid var(--line)}
.ib span{
  display:inline-flex;align-items:center;gap:9px;
  font-size:10.5px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-dk);
}
.ib span::before{content:'';width:6px;height:6px;background:var(--gold)}
.ib a,.ib p{
  display:block;margin-top:13px;
  font-size:17.5px;font-weight:400;line-height:1.5;color:var(--navy);
  transition:color .28s var(--ease);
}
.ib a:hover{color:var(--gold-dk)}
.ib p.kucuk{font-size:15px;font-weight:300;line-height:1.7;color:rgba(12,27,42,.7)}

/* şeffaf maket görseli — hizmet kartlarıyla aynı dil */
.ilt-gorsel{margin-top:38px}
.ilt-gorsel img{width:100%;height:auto;display:block}

/* ——— sağ sütun: form ——— */
.ilt-form{background:#E7E3D9;padding:44px 44px 46px}
.ilt-form h2{
  font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.35rem,2.3vw,1.95rem);line-height:1.2;letter-spacing:-.02em;color:var(--navy);
}
.ilt-form h2 em{font-style:normal;color:var(--gold-dk)}
.ilt-form>p{margin-top:14px;font-size:15px;font-weight:300;line-height:1.72;color:rgba(12,27,42,.7)}

.frm{margin-top:32px;display:grid;gap:18px}
.frm-ikili{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.fa{display:flex;flex-direction:column;gap:9px}
.fa label{font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:rgba(12,27,42,.62)}
.fa label b{color:var(--gold-dk);font-weight:600}
.fa input,.fa select,.fa textarea{
  width:100%;padding:14px 15px;background:var(--cream);
  border:1px solid var(--line);border-radius:0;          /* keskin köşe — kapsül alan yok */
  font-family:inherit;font-size:15px;font-weight:300;color:var(--navy);
  transition:border-color .3s var(--ease),background .3s var(--ease);
}
.fa textarea{min-height:118px;resize:vertical;line-height:1.7}
.fa input::placeholder,.fa textarea::placeholder{color:rgba(12,27,42,.34)}
.fa input:hover,.fa select:hover,.fa textarea:hover{border-color:rgba(12,27,42,.26)}
.fa input:focus,.fa select:focus,.fa textarea:focus{
  outline:none;border-color:var(--gold-dk);background:#fff;
}
/* tarayıcının kendi okunu gizleyip kendi okumuzu koyuyoruz */
.fa select{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:40px}
.fa.sec{position:relative}
.fa.sec::after{
  content:'';position:absolute;right:16px;bottom:20px;width:8px;height:8px;
  border-right:1.6px solid var(--navy);border-bottom:1.6px solid var(--navy);
  transform:rotate(45deg);pointer-events:none;opacity:.55;
}
.frm-alt{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;margin-top:6px}
.frm-not{font-size:12.5px;font-weight:300;line-height:1.62;color:rgba(12,27,42,.55);max-width:44ch}
.frm button{
  display:inline-flex;align-items:center;gap:12px;
  padding:15px 26px;background:var(--gold);border:1px solid var(--gold);border-radius:0;
  font-family:inherit;font-size:12.5px;font-weight:500;letter-spacing:.02em;color:#1B1409;
  cursor:pointer;white-space:nowrap;
  transition:background .32s var(--ease),border-color .32s var(--ease),color .32s var(--ease),gap .32s var(--ease);
}
.frm button:hover{background:var(--navy);border-color:var(--navy);color:var(--cream);gap:17px}
.frm button svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.9}
/* gönderim sonrası bilgi satırı */
.frm-durum{
  display:none;margin-top:18px;padding:15px 17px;
  background:rgba(201,163,78,.14);border-left:2px solid var(--gold);
  font-size:14px;font-weight:300;line-height:1.66;color:var(--navy);
}
.frm-durum.on{display:block}

@media (max-width:1280px){
  .ilt-in{gap:56px}
  .ilt-form{padding:36px 34px 38px}
}
@media (max-width:1080px){
  .ilt{padding-bottom:84px}
  .ilt-in{grid-template-columns:1fr;gap:44px}
  /* form önce gelsin — sayfanın asıl işi o */
  .ilt-form{order:-1}
  .ilt-gorsel{max-width:460px;margin-top:30px}
}
@media (max-width:860px){
  .ilt{padding-bottom:64px}
  .ilt-form{padding:26px 22px 30px}
  .ilt-form>p{font-size:14.5px}
  .frm{margin-top:26px;gap:15px}
  .frm-ikili{grid-template-columns:1fr;gap:15px}
  .ib{padding:20px 0}
  .ib a,.ib p{font-size:16px;margin-top:10px}
  .frm-alt{flex-direction:column;align-items:stretch}
  .frm button{justify-content:space-between;padding:15px 20px}
  .ilt-gorsel{max-width:none}
}

/* ═══════════════════════════════════════════
   HABER DETAY SAYFASI (.hbr) — içerik panelden gelir
   Krem üst blok (etiket + tarih + başlık + özet) → tam genişlik kapak →
   dar sütunda okuma metni → diğer haberler.
   ═══════════════════════════════════════════ */
.hbr{position:relative;z-index:1;background:var(--cream);padding:150px 0 0}
.hbr-in{max-width:var(--en);margin:0 auto;padding:0 var(--kenar)}
.hbr .crumb{color:rgba(12,27,42,.48)}
.hbr .crumb b{color:rgba(12,27,42,.82)}
.hbr .crumb a:hover{color:var(--gold-dk)}

.hbr-ust{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-bottom:20px}
.hbr-kat{
  display:inline-flex;align-items:center;gap:9px;
  font-size:10.5px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-dk);
}
.hbr-kat::before{content:'';width:6px;height:6px;background:var(--gold)}
.hbr-tarih{font-size:13px;font-weight:300;color:rgba(12,27,42,.58)}
.hbr-ust::after{content:'';flex:1;height:1px;background:var(--line);min-width:40px}

.hbr h1{
  font-family:var(--font-display);font-weight:400;max-width:20ch;
  font-size:clamp(1.9rem,4.2vw,3.7rem);line-height:1.13;letter-spacing:-.028em;color:var(--navy);
}
.hbr-ozet{
  margin-top:24px;max-width:64ch;
  font-size:17.5px;font-weight:300;line-height:1.68;color:rgba(12,27,42,.78);
}

/* kapak: sayfayı boydan boya keser (hakkımızdaki şeritle aynı dil) */
.hbr-kapak{margin-top:52px}
.hbr-kapak img{width:100%;height:clamp(240px,38vw,520px);object-fit:cover;display:block}

/* okuma sütunu — tam genişlikte uzun satır yorucu olur */
.hbr-icerik{max-width:70ch;margin:0 auto;padding:64px var(--kenar) 0}
.hbr-icerik p{font-size:16.5px;font-weight:300;line-height:1.82;color:rgba(12,27,42,.78)}
.hbr-icerik p+p{margin-top:24px}

.hbr-alt{max-width:var(--en);margin:66px auto 0;padding:0 var(--kenar)}
.hbr-donus{
  display:inline-flex;align-items:center;gap:11px;padding-bottom:14px;
  border-bottom:1px solid var(--line);
  font-size:12.5px;font-weight:500;letter-spacing:.02em;color:var(--navy);
  transition:gap .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease);
}
.hbr-donus:hover{gap:17px;color:var(--gold-dk);border-color:var(--gold)}
.hbr-donus svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.9}

/* diğer haberler */
.hbr-diger{position:relative;z-index:1;background:var(--cream);padding:92px 0 104px}
.hbr-diger-in{max-width:var(--en);margin:0 auto;padding:0 var(--kenar)}
.hbr-diger h2{
  margin-top:18px;margin-bottom:34px;font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.4rem,2.5vw,2.1rem);line-height:1.2;letter-spacing:-.02em;color:var(--navy);
}

/* haber bulunamadı */
.hbr-yok{display:none;max-width:var(--en);margin:0 auto;padding:120px var(--kenar) 130px}
.hbr-yok.on{display:block}
.hbr-yok h1{font-size:clamp(1.6rem,3.4vw,2.6rem);margin-bottom:18px}
.hbr-yok p{font-size:15.5px;font-weight:300;line-height:1.74;color:rgba(12,27,42,.7);max-width:52ch}
.hbr-yok .act{margin-top:30px}

/* ═══════════ "YAKINDA" DURUMU ═══════════
   Panelde hiç haber yokken karuselin / listenin yerine geçer.
   Arka planda site amblemi soluk durur — boş alan boş görünmesin. */
.yakinda{display:none;position:relative;overflow:hidden;background:#E7E3D9;padding:88px 0 92px}
.yakinda.on{display:block}
.yakinda::before{
  content:'';position:absolute;right:-2%;top:50%;transform:translateY(-50%);
  width:min(340px,38%);aspect-ratio:1;
  background:url(kure.webp) center/contain no-repeat;opacity:.2;pointer-events:none;
}
/* ince çizgi dokusu */
.yakinda::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(90deg,
    rgba(12,27,42,.045) 0 1px, rgba(12,27,42,0) 1px 26px);
  mask-image:linear-gradient(90deg, #000 0%, transparent 62%);
}
.yakinda-in{position:relative;z-index:1;max-width:var(--en);margin:0 auto;padding:0 var(--kenar)}
.yakinda b{
  display:inline-flex;align-items:center;gap:11px;
  font-size:10.5px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-dk);
}
.yakinda b::before{content:'';width:7px;height:7px;background:var(--gold)}
.yakinda h3{
  margin-top:20px;font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.5rem,3vw,2.5rem);line-height:1.18;letter-spacing:-.024em;color:var(--navy);
}
.yakinda p{
  margin-top:20px;max-width:52ch;
  font-size:15.5px;font-weight:300;line-height:1.74;color:rgba(12,27,42,.7);
}

@media (max-width:1080px){
  .hbr{padding-top:126px}
  .hbr-icerik{padding-top:48px}
  .hbr-diger{padding:68px 0 78px}
  .yakinda{padding:64px 0 68px}
}
@media (max-width:860px){
  .hbr{padding-top:112px}
  .hbr h1{font-size:clamp(1.7rem,7.4vw,2.3rem);max-width:none}
  .hbr .crumb{font-size:11px;gap:8px;margin-bottom:16px;flex-wrap:wrap}
  .hbr-ozet{font-size:15.5px;margin-top:18px}
  .hbr-kapak{margin-top:32px}
  .hbr-kapak img{height:clamp(190px,52vw,280px)}
  .hbr-icerik{padding-top:36px}
  .hbr-icerik p{font-size:15.5px;line-height:1.78}
  .hbr-icerik p+p{margin-top:19px}
  .hbr-alt{margin-top:46px}
  .hbr-diger{padding:56px 0 64px}
  .hbr-yok{padding:96px var(--kenar) 100px}
  .yakinda{padding:48px 0 52px}
  .yakinda::before{opacity:.13;width:56%}
  .yakinda h3{font-size:clamp(1.4rem,6vw,1.85rem)}
  .yakinda p{font-size:14.5px;margin-top:16px}
}