/* ============================================================
   ÜTOPYA — Ana Stil
   ============================================================ */

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--font); font-weight:var(--w-light);
  font-size:var(--fs-body); line-height:var(--lh-body);
  -webkit-font-smoothing:antialiased;
  transition:background-color var(--t-slow) var(--ease);
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
h1,h2,h3,h4{ margin:0; font-weight:var(--w-bold); color:var(--ink-strong); line-height:var(--lh-tight); }
p{ margin:0 0 1em; }
.wrap{ max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad-x); }
.sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }

/* ---------- ÜST MENÜ ---------- */
.head{
  position:fixed; inset:0 0 auto 0; z-index:60;
  height:var(--head-h); display:flex; align-items:center;
  padding-inline:var(--pad-x);
  transition:height var(--t-mid) var(--ease), background-color var(--t-mid) var(--ease),
             transform var(--t-mid) var(--ease), border-color var(--t-mid) var(--ease);
  border-bottom:1px solid transparent;
}
.head.is-solid{ height:var(--head-h-sm); background:var(--bg); border-bottom-color:var(--line); }
.head.is-hidden{ transform:translateY(-100%); }
.head.on-dark{ color:var(--light); }
.head.on-dark .brand-sub{ color:rgba(242,242,242,.62); }

.brand{ display:flex; align-items:baseline; gap:10px; letter-spacing:var(--ls-mid); }
.brand-name{ font-weight:var(--w-bold); font-size:16px; letter-spacing:.16em; text-transform:uppercase; }
.brand-sub{ font-size:var(--fs-micro); letter-spacing:var(--ls-wide); text-transform:uppercase; color:var(--ink-mute); }

.nav{ margin-left:auto; display:flex; align-items:center; gap:clamp(16px,2.2vw,34px); }
.nav a{
  font-size:var(--fs-nav); font-weight:var(--w-med); letter-spacing:var(--ls-mid);
  position:relative; padding-block:6px; transition:color var(--t-fast) var(--ease);
}
.nav a::after{
  content:""; position:absolute; left:0; right:100%; bottom:0; height:1px;
  background:currentColor; transition:right var(--t-mid) var(--ease);
}
.nav a:hover::after, .nav a[aria-current]::after{ right:0; }
.lang{ font-size:var(--fs-micro); letter-spacing:var(--ls-wide); opacity:.7; }
.lang:hover{ opacity:1; }

.burger{ display:none; margin-left:auto; width:34px; height:34px; position:relative; }
.burger span{ position:absolute; left:5px; right:5px; height:1.5px; background:currentColor;
  transition:transform var(--t-mid) var(--ease), opacity var(--t-fast); }
.burger span:nth-child(1){ top:12px; } .burger span:nth-child(2){ bottom:12px; }
body.menu-open .burger span:nth-child(1){ transform:translateY(5px) rotate(45deg); }
body.menu-open .burger span:nth-child(2){ transform:translateY(-5px) rotate(-45deg); }

/* ---------- MOBİL PANEL ---------- */
.panel{
  position:fixed; inset:0; z-index:55; background:var(--bg);
  display:flex; flex-direction:column; justify-content:center; gap:6px;
  padding:var(--pad-x); opacity:0; visibility:hidden;
  transition:opacity var(--t-mid) var(--ease), visibility var(--t-mid);
}
body.menu-open .panel{ opacity:1; visibility:visible; }
.panel a{
  font-size:clamp(24px,7vw,40px); font-weight:var(--w-bold); color:var(--ink-strong);
  letter-spacing:var(--ls-mid); opacity:0; transform:translateY(14px);
  transition:opacity var(--t-mid) var(--ease), transform var(--t-mid) var(--ease);
}
body.menu-open .panel a{ opacity:1; transform:none; }
body.menu-open .panel a:nth-child(1){ transition-delay:.10s; }
body.menu-open .panel a:nth-child(2){ transition-delay:.16s; }
body.menu-open .panel a:nth-child(3){ transition-delay:.22s; }
body.menu-open .panel a:nth-child(4){ transition-delay:.28s; }
body.menu-open .panel a:nth-child(5){ transition-delay:.34s; }

/* ---------- HERO ---------- */
.hero{ position:relative; height:100svh; min-height:520px; overflow:hidden; background:var(--dark); }
.hero video, .hero .hero-img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
}
.hero::after{ content:""; position:absolute; inset:0; background:var(--overlay); }
.hero-in{
  position:absolute; inset:auto 0 0 0; z-index:2; color:var(--light);
  padding:0 var(--pad-x) clamp(48px,7vw,86px);
}
.hero h1{
  color:var(--light); font-size:var(--fs-h1); font-weight:var(--w-light);
  letter-spacing:.02em; max-width:16ch;
}
.hero h1 b{ font-weight:var(--w-bold); }
.hero-note{
  margin-top:18px; font-size:var(--fs-small); letter-spacing:var(--ls-mid);
  color:rgba(242,242,242,.78); max-width:44ch;
}
.scroll-cue{
  position:absolute; left:var(--pad-x); bottom:20px; z-index:2;
  font-size:var(--fs-micro); letter-spacing:var(--ls-wide); text-transform:uppercase;
  color:rgba(242,242,242,.6);
}

/* ---------- BÖLÜM ---------- */
.sec{ padding-block:var(--sec-y); }
.sec-head{
  display:flex; align-items:baseline; justify-content:space-between; gap:20px;
  padding-bottom:16px; margin-bottom:clamp(26px,4vw,52px); border-bottom:1px solid var(--line);
}
.eyebrow{
  font-size:var(--fs-micro); letter-spacing:var(--ls-wide); text-transform:uppercase;
  color:var(--accent); font-weight:var(--w-med);
}
.sec-head h2{ font-size:var(--fs-h2); font-weight:var(--w-bold); letter-spacing:.01em; }
.more{ font-size:var(--fs-small); letter-spacing:var(--ls-mid); white-space:nowrap; border-bottom:1px solid currentColor; padding-bottom:2px; }

/* ---------- PROJE IZGARASI ---------- */
.grid{ display:grid; gap:var(--gap); grid-template-columns:repeat(3,1fr); }
.grid.two{ grid-template-columns:repeat(2,1fr); }
@media(max-width:1100px){ .grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:680px){ .grid, .grid.two{ grid-template-columns:1fr; } }

.card{ display:block; }
.card-media{
  position:relative; overflow:hidden; background:var(--bg-alt);
  aspect-ratio:1/1;
}
.card-media img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  transition:opacity var(--t-mid) var(--ease), transform 1.1s var(--ease);
}
.card-media img.alt{ opacity:0; }
.card:hover .card-media img.main{ opacity:0; }
.card:hover .card-media img.alt{ opacity:1; }
.card:hover .card-media img{ transform:scale(1.035); }
.card-tag{
  position:absolute; left:12px; top:12px; z-index:2;
  font-size:var(--fs-micro); letter-spacing:var(--ls-mid); text-transform:uppercase;
  background:var(--bg); color:var(--ink-strong); padding:5px 9px;
}
.card-body{ padding-top:13px; display:flex; align-items:baseline; justify-content:space-between; gap:12px; }
.card-body h3{ font-size:var(--fs-h3); font-weight:var(--w-bold); }
.card-meta{ font-size:var(--fs-small); color:var(--ink-mute); white-space:nowrap; }

/* ---------- FİLTRE ---------- */
.filters{ display:flex; flex-wrap:wrap; gap:6px 22px; margin-bottom:clamp(22px,3vw,40px); }
.filters button{
  font-size:var(--fs-small); letter-spacing:var(--ls-mid); color:var(--ink-mute);
  padding-bottom:3px; border-bottom:1px solid transparent;
  transition:color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
}
.filters button:hover{ color:var(--ink-strong); }
.filters button.on{ color:var(--accent); border-bottom-color:var(--accent); }
.filters sup{ font-size:9px; margin-left:3px; opacity:.6; }

/* ---------- RAKAMLAR ---------- */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:var(--gap); border-top:1px solid var(--line); }
@media(max-width:680px){ .stats{ grid-template-columns:repeat(2,1fr); } }
.stat{ padding-top:22px; }
.stat b{ display:block; font-size:clamp(30px,4vw,52px); font-weight:var(--w-light); color:var(--ink-strong); letter-spacing:-.01em; }
.stat span{ font-size:var(--fs-micro); letter-spacing:var(--ls-wide); text-transform:uppercase; color:var(--ink-mute); }

/* ---------- HİZMET LİSTESİ ---------- */
.svc{ border-top:1px solid var(--line); }
.svc a{
  display:grid; grid-template-columns:64px 1fr auto; gap:20px; align-items:center;
  padding:clamp(18px,2.4vw,30px) 0; border-bottom:1px solid var(--line);
  transition:padding-inline var(--t-mid) var(--ease), color var(--t-fast) var(--ease);
}
.svc a:hover{ padding-inline:14px; color:var(--accent); }
.svc .no{ font-size:var(--fs-micro); letter-spacing:var(--ls-mid); color:var(--ink-mute); }
.svc h3{ font-size:var(--fs-h2); font-weight:var(--w-light); color:inherit; }
.svc .arrow{ font-size:20px; opacity:.35; transition:transform var(--t-mid) var(--ease), opacity var(--t-fast); }
.svc a:hover .arrow{ transform:translateX(8px); opacity:1; }

/* ---------- İLETİŞİM BANDI ---------- */
.cta{ background:var(--dark); color:var(--light); }
.cta .wrap{ padding-block:var(--sec-y); }
.cta h2{ color:var(--light); font-size:var(--fs-h1); font-weight:var(--w-light); max-width:18ch; }
.cta a.big{
  display:inline-block; margin-top:26px; font-size:var(--fs-h3); letter-spacing:var(--ls-mid);
  border-bottom:1px solid rgba(242,242,242,.4); padding-bottom:5px;
  transition:border-color var(--t-fast), transform var(--t-mid) var(--ease);
}
.cta a.big:hover{ border-bottom-color:var(--light); transform:translateX(6px); }

/* ---------- ALT BİLGİ ---------- */
.foot{ border-top:1px solid var(--line); font-size:var(--fs-small); }
.foot .wrap{ padding-block:36px; display:grid; grid-template-columns:2fr 1fr 1fr; gap:32px; }
@media(max-width:820px){ .foot .wrap{ grid-template-columns:1fr; } }
.foot h4{ font-size:var(--fs-micro); letter-spacing:var(--ls-wide); text-transform:uppercase; color:var(--ink-mute); margin-bottom:12px; font-weight:var(--w-med); }
.foot ul{ list-style:none; margin:0; padding:0; }
.foot li{ margin-bottom:7px; }
.foot a:hover{ color:var(--accent); }
.foot-base{ border-top:1px solid var(--line); }
.foot-base .wrap{ padding-block:18px; display:flex; justify-content:space-between; gap:16px; font-size:var(--fs-micro); color:var(--ink-mute); letter-spacing:var(--ls-mid); }

/* ---------- BELİRME ---------- */
/* JS yoksa icerik her zaman gorunur kalir */
.js .rise{ opacity:0; transform:translateY(22px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.js .rise.in{ opacity:1; transform:none; }

@media(max-width:820px){
  .nav{ display:none; }
  .burger{ display:block; }
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ transition-duration:.01ms !important; animation-duration:.01ms !important; }
  html{ scroll-behavior:auto; }
}

/* ============================================================
   SAYFA İÇİ BLOKLAR
   ============================================================ */
.page{ padding-top:var(--head-h); }
.page .hero{ margin-top:calc(var(--head-h) * -1); }

/* --- proje detay --- */
.hero-proje{ height:78svh; }
.proje-ust{ display:grid; grid-template-columns:minmax(260px,1fr) 2fr; gap:clamp(24px,5vw,72px); }
@media(max-width:820px){ .proje-ust{ grid-template-columns:1fr; } }
.kunye{ border-top:1px solid var(--line); }
.kunye .k{ display:flex; justify-content:space-between; gap:14px; padding:11px 0; border-bottom:1px solid var(--line); }
.kunye .k span{ font-size:var(--fs-micro); letter-spacing:var(--ls-wide); text-transform:uppercase; color:var(--ink-mute); }
.kunye .k b{ font-weight:var(--w-med); color:var(--ink-strong); font-size:var(--fs-small); text-align:right; }
.konsept p{ font-size:clamp(15px,1.15vw,18px); }

.galeri{ display:grid; grid-template-columns:repeat(2,1fr); gap:var(--gap); }
@media(max-width:680px){ .galeri{ grid-template-columns:1fr; } }
.galeri figure{ margin:0; background:var(--bg-alt); overflow:hidden; }
.galeri figure.wide{ grid-column:1 / -1; }
.galeri img{ width:100%; height:100%; object-fit:cover; transition:transform 1.2s var(--ease); }
.galeri figure:hover img{ transform:scale(1.02); }

.proje-nav{ display:grid; grid-template-columns:1fr auto 1fr; gap:20px; align-items:center;
  border-top:1px solid var(--line); padding-top:24px; }
@media(max-width:680px){ .proje-nav{ grid-template-columns:1fr; text-align:center; } }
.pn span{ display:block; font-size:var(--fs-micro); letter-spacing:var(--ls-wide);
  text-transform:uppercase; color:var(--ink-mute); margin-bottom:5px; }
.pn b{ font-weight:var(--w-bold); color:var(--ink-strong); }
.pn.next{ text-align:right; } .pn.all{ font-size:var(--fs-small); border-bottom:1px solid var(--line); padding-bottom:3px; }
.pn:hover b{ color:var(--accent); }

/* --- hizmetler --- */
.hiz-list{ border-top:1px solid var(--line); }
.hiz{ display:grid; grid-template-columns:74px 1fr; gap:20px;
  padding:clamp(22px,3vw,38px) 0; border-bottom:1px solid var(--line); }
@media(max-width:680px){ .hiz{ grid-template-columns:1fr; gap:8px; } }
.hiz .no{ font-size:var(--fs-micro); letter-spacing:var(--ls-mid); color:var(--accent); padding-top:6px; }
.hiz h3{ font-size:var(--fs-h2); font-weight:var(--w-light); margin-bottom:10px; }
.hiz p{ max-width:62ch; color:var(--ink); }

/* --- kişi kartı --- */
.kisi-foto{ aspect-ratio:1/1; overflow:hidden; background:var(--bg-alt); margin-bottom:13px; }
.kisi-foto img{ width:100%; height:100%; object-fit:cover; filter:grayscale(1); transition:filter var(--t-mid) var(--ease); }
.kisi:hover .kisi-foto img{ filter:none; }
.kisi h3{ font-size:var(--fs-h3); }
.kisi p{ margin-top:6px; font-size:var(--fs-small); color:var(--ink-mute); }

/* --- ödüller --- */
.odul{ list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }
.odul li{ display:grid; grid-template-columns:80px 1fr auto; gap:16px; align-items:baseline;
  padding:15px 0; border-bottom:1px solid var(--line); }
@media(max-width:680px){ .odul li{ grid-template-columns:60px 1fr; } .odul i{ grid-column:2; } }
.odul span{ font-size:var(--fs-small); color:var(--ink-mute); }
.odul b{ font-weight:var(--w-med); color:var(--ink-strong); }
.odul i{ font-style:normal; font-size:var(--fs-small); color:var(--ink-mute); }

/* --- form --- */
.form{ display:flex; flex-direction:column; gap:16px; max-width:560px; }
.form label{ display:flex; flex-direction:column; gap:6px;
  font-size:var(--fs-micro); letter-spacing:var(--ls-wide); text-transform:uppercase; color:var(--ink-mute); }
.form input, .form textarea{
  font:inherit; font-size:var(--fs-small); color:var(--ink-strong);
  background:transparent; border:0; border-bottom:1px solid var(--line);
  padding:9px 0; transition:border-color var(--t-fast) var(--ease); }
.form input:focus, .form textarea:focus{ outline:none; border-bottom-color:var(--accent); }
.form textarea{ resize:vertical; }
.form .onay{ flex-direction:row; align-items:flex-start; gap:9px; text-transform:none; letter-spacing:normal; font-size:var(--fs-small); }
.form .onay input{ width:15px; height:15px; margin-top:3px; flex:none; }
.btn{ align-self:flex-start; border:1px solid var(--ink-strong); color:var(--ink-strong);
  padding:11px 30px; font-size:var(--fs-small); letter-spacing:var(--ls-mid);
  transition:background-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease); }
.btn:hover{ background:var(--ink-strong); color:var(--light); }
.form-not{ font-size:var(--fs-micro); color:var(--ink-mute); margin:0; }

.bilgi{ border-top:1px solid var(--line); margin-bottom:22px; }
.bilgi .k{ display:grid; grid-template-columns:130px 1fr; gap:14px; padding:13px 0; border-bottom:1px solid var(--line); }
.bilgi .k span{ font-size:var(--fs-micro); letter-spacing:var(--ls-wide); text-transform:uppercase; color:var(--ink-mute); }
.bilgi .k b{ font-weight:var(--w-med); color:var(--ink-strong); font-size:var(--fs-small); }
.harita{ aspect-ratio:16/10; background:var(--bg-alt); display:grid; place-items:center;
  font-size:var(--fs-small); color:var(--ink-mute); border:1px dashed var(--line); }

/* ============================================================
   TEK SAYFA
   ============================================================ */
.nav a.spy-on::after{ right:0; }
.nav a.spy-on{ color:var(--accent); }
.head.on-dark .nav a.spy-on{ color:var(--light); }

section[id], article[id]{ scroll-margin-top:calc(var(--head-h-sm) + 18px); }

/* --- proje detay katmanı --- */
.pd{
  position:fixed; inset:0; z-index:80; background:var(--bg);
  overflow-y:auto; overscroll-behavior:contain;
  opacity:0; visibility:hidden; transform:translateY(24px);
  transition:opacity var(--t-mid) var(--ease), transform var(--t-mid) var(--ease), visibility var(--t-mid);
}
.pd.open{ opacity:1; visibility:visible; transform:none; }
.pd-bar{
  position:sticky; top:0; z-index:3; background:var(--bg);
  display:flex; align-items:center; gap:16px;
  padding:14px var(--pad-x); border-bottom:1px solid var(--line);
}
.pd-bar .t{ font-weight:var(--w-bold); color:var(--ink-strong); font-size:var(--fs-small); letter-spacing:var(--ls-mid); }
.pd-bar .c{ margin-left:auto; font-size:var(--fs-micro); letter-spacing:var(--ls-wide);
  text-transform:uppercase; color:var(--ink-mute); display:flex; align-items:center; gap:9px; }
.pd-bar .c:hover{ color:var(--accent); }
.pd-bar .c i{ font-style:normal; font-size:17px; line-height:1; }
.pd-hero{ position:relative; height:64svh; min-height:340px; overflow:hidden; background:var(--dark); }
.pd-hero img{ width:100%; height:100%; object-fit:cover; }
.pd-hero::after{ content:""; position:absolute; inset:0; background:var(--overlay); }
.pd-hero .in{ position:absolute; inset:auto 0 0 0; z-index:2; color:var(--light); padding:0 var(--pad-x) clamp(28px,4vw,54px); }
.pd-hero h2{ color:var(--light); font-size:var(--fs-h1); font-weight:var(--w-light); }
.pd-adim{ display:flex; gap:10px; align-items:center; }
.pd-adim button{ font-size:var(--fs-small); letter-spacing:var(--ls-mid); color:var(--ink-mute);
  border:1px solid var(--line); padding:7px 15px; transition:all var(--t-fast) var(--ease); }
.pd-adim button:hover{ color:var(--ink-strong); border-color:var(--ink-strong); }
body.pd-open{ overflow:hidden; }

/* ============================================================
   AÇILIŞ SAYFASI — kaydırmasız, tam ekran video
   ============================================================ */
html.giris, html.giris body{ height:100%; overflow:hidden; }
.giris-ekran{ position:fixed; inset:0; overflow:hidden; background:var(--dark); }
.giris-ekran video, .giris-ekran img.bg{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
}
.giris-ekran::after{ content:""; position:absolute; inset:0; background:var(--overlay); }
.giris-in{
  position:absolute; inset:auto 0 0 0; z-index:2; color:var(--light);
  padding:0 var(--pad-x) clamp(52px,8vh,110px);
}
.giris-in h1{
  color:var(--light); font-size:var(--fs-h1); font-weight:var(--w-light);
  letter-spacing:.02em; max-width:17ch;
}
.giris-in h1 b{ font-weight:var(--w-bold); }
.giris-note{ margin-top:16px; font-size:var(--fs-small); letter-spacing:var(--ls-mid);
  color:rgba(242,242,242,.8); max-width:46ch; }
.giris-alt{
  position:absolute; inset:auto 0 0 0; z-index:2; padding:0 var(--pad-x) 18px;
  display:flex; justify-content:space-between; gap:16px;
  font-size:var(--fs-micro); letter-spacing:var(--ls-wide); text-transform:uppercase;
  color:rgba(242,242,242,.55);
}

/* ============================================================
   HİZMETLER AÇILIR MENÜ
   ============================================================ */
.has-drop{ position:relative; }
.drop-btn{ display:inline-flex; align-items:center; gap:7px;
  font-size:var(--fs-nav); font-weight:var(--w-med); letter-spacing:var(--ls-mid);
  padding-block:6px; position:relative; transition:color var(--t-fast) var(--ease); }
.drop-btn i{ font-style:normal; font-size:9px; transition:transform var(--t-fast) var(--ease); }
.has-drop[aria-expanded="true"] .drop-btn i{ transform:rotate(180deg); }
.drop{
  position:absolute; top:calc(100% + 14px); right:0; min-width:290px; z-index:70;
  background:var(--bg); border:1px solid var(--line); padding:8px 0;
  opacity:0; visibility:hidden; transform:translateY(-8px);
  transition:opacity var(--t-fast) var(--ease), transform var(--t-fast) var(--ease), visibility var(--t-fast);
  box-shadow:0 18px 44px rgba(10,22,38,.13);
}
.has-drop[aria-expanded="true"] .drop{ opacity:1; visibility:visible; transform:none; }
.drop a{
  display:flex; gap:11px; align-items:baseline;
  padding:9px 18px; font-size:var(--fs-small); font-weight:var(--w-reg);
  color:var(--ink); letter-spacing:0; transition:background-color var(--t-fast), color var(--t-fast);
}
.drop a::after{ display:none; }
.drop a span{ font-size:9px; color:var(--ink-mute); letter-spacing:.1em; flex:none; padding-top:2px; }
.drop a:hover{ background:var(--bg-alt); color:var(--accent); }
.drop-tum{ border-top:1px solid var(--line); margin-top:6px; padding-top:12px !important;
  font-weight:var(--w-med) !important; color:var(--accent) !important; }

/* mobil panelde açılır liste */
.panel .alt-liste{ display:flex; flex-direction:column; gap:2px; margin:8px 0 14px 2px; }
.panel .alt-liste a{ font-size:clamp(13px,3.4vw,15px); font-weight:var(--w-reg);
  color:var(--ink-mute); opacity:1; transform:none; letter-spacing:0; }
.panel .alt-liste a:hover{ color:var(--accent); }

/* açılış ekranında üst menü okunurluğu */
.giris-ekran::before{
  content:""; position:absolute; inset:0 0 auto 0; height:210px; z-index:1;
  background:linear-gradient(to bottom, rgba(8,16,28,.55), rgba(8,16,28,0));
  pointer-events:none;
}
.giris-in, .giris-alt{ z-index:3; }
.giris-in{ padding-bottom:clamp(72px,10vh,130px); }

/* video hangi tonda olursa olsun menü okunsun */
.giris-ekran::before{ height:260px; background:linear-gradient(to bottom, rgba(8,16,28,.72), rgba(8,16,28,.28) 55%, rgba(8,16,28,0)); }
.head.on-dark .brand-name, .head.on-dark .nav a, .head.on-dark .drop-btn{
  color:#fff; text-shadow:0 1px 14px rgba(8,16,28,.55);
}
.head.on-dark .brand-sub{ color:rgba(255,255,255,.75); text-shadow:0 1px 12px rgba(8,16,28,.5); }
.head.on-dark .drop a, .head.on-dark .drop-tum{ text-shadow:none; }
.giris-in h1, .giris-note{ text-shadow:0 2px 26px rgba(8,16,28,.4); }

/* ---------- VİDEO BANDI ---------- */
.vband{ position:relative; overflow:hidden; background:var(--dark); height:clamp(300px,52vh,600px); }
.vband video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.vband::after{ content:""; position:absolute; inset:0; background:var(--overlay); }
.vband .in{ position:absolute; inset:auto 0 0 0; z-index:2; color:var(--light);
  padding:0 var(--pad-x) clamp(28px,4vw,54px); }
.vband .in h2{ color:var(--light); font-size:var(--fs-h2); font-weight:var(--w-light); max-width:20ch;
  text-shadow:0 2px 24px rgba(8,16,28,.45); }
.vband .in .eyebrow{ color:rgba(255,255,255,.72); }


/* ---------- KOYU ZEMİNDE SAF BEYAZ ---------- */
.giris-in h1, .giris-in .giris-note,
.hero h1, .hero .hero-note,
.vband .in h2, .cta h2, .cta a.big,
.head.on-dark .brand-name, .head.on-dark .nav a, .head.on-dark .drop-btn{ color:#fff; }
.giris-alt, .head.on-dark .brand-sub, .vband .in .eyebrow{ color:rgba(255,255,255,.85); }
.giris-in .giris-note, .hero .hero-note{ color:rgba(255,255,255,.92); }
.scroll-cue{ color:rgba(255,255,255,.75); }

/* sans-serif düzeltmeleri */
.brand-name{ letter-spacing:.12em; }
.hero h1, .giris-in h1{ letter-spacing:-.01em; line-height:1.08; }
.sec-head h2, .cta h2{ letter-spacing:-.01em; }
.stat b{ letter-spacing:-.02em; }
.eyebrow, .card-tag, .foot h4, .stat span, .kunye .k span, .bilgi .k span, .pn span, .giris-alt{ letter-spacing:.13em; }

/* ---------- AÇILIR MENÜ RENK DÜZELTMESİ ----------
   .drop a de .nav içinde olduğu için beyaz metin kuralını yiyordu. */
.head.on-dark .drop a,
.head.is-solid .drop a,
.drop a{ color:var(--ink) !important; text-shadow:none !important; }
.head.on-dark .drop a:hover,
.drop a:hover{ color:var(--accent) !important; background:var(--bg-alt); }
.head.on-dark .drop a span,
.drop a span{ color:var(--ink-mute) !important; }
.head.on-dark .drop-tum,
.drop-tum{ color:var(--accent) !important; }
.drop a::after{ content:none !important; }
.drop a.drop-tum, .head.on-dark .drop a.drop-tum{ color:var(--accent) !important; font-weight:var(--w-med); }

/* ============================================================
   HİZMET DETAY SAYFASI
   ============================================================ */
.hz-hero{ position:relative; height:58svh; min-height:320px; overflow:hidden; background:var(--dark); }
.hz-hero img{ width:100%; height:100%; object-fit:cover; }
.hz-hero::after{ content:""; position:absolute; inset:0; background:var(--overlay); }
.hz-hero .in{ position:absolute; inset:auto 0 0 0; z-index:2; color:#fff;
  padding:0 var(--pad-x) clamp(30px,5vw,60px); }
.hz-hero .in h1{ color:#fff; font-size:var(--fs-h1); font-weight:var(--w-light); letter-spacing:-.01em; max-width:18ch; }
.hz-hero .in .eyebrow{ color:rgba(255,255,255,.8); }

.hz-ust{ display:grid; grid-template-columns:2fr minmax(240px,1fr); gap:clamp(24px,5vw,72px); }
@media(max-width:820px){ .hz-ust{ grid-template-columns:1fr; } }
.hz-ust .metin p{ font-size:clamp(15px,1.15vw,18px); }
.hz-dahil{ border-top:1px solid var(--line); }
.hz-dahil h4{ font-size:var(--fs-micro); letter-spacing:var(--ls-wide); text-transform:uppercase;
  color:var(--ink-mute); margin:14px 0 10px; font-weight:var(--w-med); }
.hz-dahil ul{ list-style:none; margin:0 0 18px; padding:0; }
.hz-dahil li{ position:relative; padding:7px 0 7px 18px; border-bottom:1px solid var(--line); font-size:var(--fs-small); }
.hz-dahil li::before{ content:""; position:absolute; left:0; top:14px; width:7px; height:1px; background:var(--accent); }

.hz-diger{ display:flex; flex-wrap:wrap; gap:8px 18px; border-top:1px solid var(--line); padding-top:18px; }
.hz-diger a{ font-size:var(--fs-small); color:var(--ink-mute); border-bottom:1px solid transparent;
  transition:color var(--t-fast), border-color var(--t-fast); }
.hz-diger a:hover{ color:var(--accent); border-bottom-color:var(--accent); }
.hz-diger a[aria-current]{ color:var(--accent); border-bottom-color:var(--accent); }

/* ============================================================
   AÇILIŞ — ORTADA LOGO, YUMUŞAK GİRİŞ
   ============================================================ */
.giris-logo{
  position:absolute; inset:0; z-index:4;
  display:grid; place-items:center; pointer-events:none;
  padding:0 var(--pad-x) 8vh;
}
.giris-logo img{
  width:min(26vw, 310px); height:auto;
  opacity:0; transform:scale(.92) translateY(10px);
  filter:drop-shadow(0 8px 40px rgba(8,16,28,.45));
  animation:logoGirCik 5s ease-in-out .3s forwards;
}
/* videodaki İSTANBUL yazısı gibi: yumuşak gir, dur, yumuşak çık */
@keyframes logoGirCik{
    0%  { opacity:0; transform:scale(.96) translateY(8px); }
   16%  { opacity:1; transform:none; }
   68%  { opacity:1; transform:none; }
   92%  { opacity:0; transform:scale(1.02); }
  100%  { opacity:0; transform:scale(1.02); }
}

/* logo ortadayken alttaki başlık sadeleşiyor */
.giris-in{ text-align:left; }
.giris-in .giris-note{
  opacity:0; animation:notGir 1.2s ease 1.9s forwards;
}
@keyframes notGir{ to{ opacity:1; } }

@media (max-width:820px){
  .giris-logo img{ width:min(52vw, 260px); }
  .giris-logo{ padding-bottom:14vh; }
}
@media (prefers-reduced-motion: reduce){
  .giris-logo img, .giris-in .giris-note{ opacity:1 !important; transform:none !important; animation:none !important; }
}


/* açılış ekranında alt yazı yok */
.giris-in, .giris-alt{ display:none; }

/* ---------- ÜST MENÜ LOGOSU ---------- */
.brand{ gap:11px; align-items:center; }
.brand-mark{ width:auto; height:38px; display:block; flex:none; }
.brand .mark-koyu{ display:block; }
.brand .mark-acik{ display:none; }
.head.on-dark .brand .mark-koyu{ display:none; }
.head.on-dark .brand .mark-acik{ display:block; }
.head.is-solid .brand-mark{ height:32px; }

/* Marka yazısı — logonun kesilmiş harfleri (font taklidi değil). */
.brand-yazi{ width:auto; height:34px; display:block; flex:none; }
.brand .yazi-koyu{ display:block; }
.brand .yazi-acik{ display:none; }
.head.on-dark .brand .yazi-koyu{ display:none; }
.head.on-dark .brand .yazi-acik{ display:block; }
.head.is-solid .brand-yazi{ height:28px; }
@media (max-width:680px){ .brand-yazi{ height:26px; } .head.is-solid .brand-yazi{ height:22px; } }

/* ---------- ALT BİLGİ LOGOSU ---------- */
.foot-logo{ width:auto; height:96px; margin-bottom:14px; display:block; }


/* ============================================================
   ALT BİLGİ — bilgin: tek satır, 58px, #191919 zemin
   ============================================================ */
.foot-bilgin{
  background:#191919; color:#fff;
  font-size:13px; font-weight:300; line-height:20px;
}
.foot-bilgin .ic{
  height:58px; display:flex; align-items:center; justify-content:space-between;
  gap:20px; padding:0 20px;
}
.foot-bilgin a{ color:#fff; transition:opacity .3s; }
.foot-bilgin a:hover{ opacity:.6; }
/* Alt çubuk — bilgin düzeni: SOLDA telif + ikonlu sosyal, SAĞDA yasal metinler. */
.foot-bilgin .ic{ flex-wrap:wrap; gap:10px 28px; }
.foot-bilgin .sol,
.foot-bilgin .sag{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 22px; }
.foot-bilgin .sag{ justify-content:flex-end; margin-left:auto; }
.foot-bilgin .telif{ white-space:nowrap; }

/* Sosyal bağlantı: tek renk çizgi ikon + ad */
.foot-bilgin .sos{ display:inline-flex; align-items:center; gap:7px; }
.foot-bilgin .sos svg{
  width:15px; height:15px; flex:none;
  fill:none; stroke:currentColor; stroke-width:1.7;
  stroke-linecap:round; stroke-linejoin:round;
}

@media (max-width:680px){
  .foot-bilgin .ic{ gap:12px; }
  .foot-bilgin .sag{ margin-left:0; justify-content:flex-start; }
}
@media (max-width:680px){
  .foot-bilgin{ font-size:12px; line-height:18px; }
  .foot-bilgin .ic{ height:auto; padding:14px 20px; flex-direction:column; align-items:flex-start; gap:8px; }
}

/* ---------- MENÜ: koyu bölümün üstündeyken katı zemin de koyu olsun ---------- */
.head.is-solid.on-dark{
  background:#191919; border-bottom-color:rgba(255,255,255,.14);
}
.head.is-solid .brand-name, .head.is-solid .nav a, .head.is-solid .drop-btn{ text-shadow:none; }

/* Marka yazısı artık logodan kesilmiş görsel (.brand-yazi); font kuralı yok. */

/* ---------- HAKKIMIZDA: ekip bölümleri ---------- */
/* Sayfa koyu zeminli (body.koyu-sayfa); metin açık renk. */
.hk-bolum{ font-size:24px; font-weight:400; line-height:1.2; letter-spacing:.01em;
  margin:64px 0 20px; padding-bottom:12px; border-bottom:1px solid rgba(255,255,255,.22); }
.hk-ekip{ list-style:none; margin:0; padding:0;
  display:grid; gap:2px 40px; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); }
.hk-ekip li{ display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 14px;
  padding:13px 0; border-top:1px solid rgba(255,255,255,.14); }
.hk-ekip li:first-child, .hk-ekip li:nth-child(2){ border-top:0; }
.hk-ekip .ad{ font-size:16px; font-weight:500; }
.hk-ekip .gorev{ font-size:12px; letter-spacing:.06em; color:rgba(255,255,255,.55); }
/* Kurucu başlığı: ad + yanında ince unvan */
.hk-kisi{ font-size:18px; font-weight:500; line-height:1.3; letter-spacing:.02em;
  margin:38px 0 14px; display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 14px; }
.hk-kisi .unvan{ font-size:12px; font-weight:400; letter-spacing:.08em;
  text-transform:uppercase; color:rgba(255,255,255,.5); }
.hk-kisi + p{ margin-top:0; }

/* Müşteriden metin gelmemiş alanlar — boş görünmesin, beklendiği belli olsun. */
.hk-bekliyor{ color:rgba(255,255,255,.45);
  text-decoration:underline dashed rgba(255,255,255,.3); text-underline-offset:4px; }

@media (max-width:900px){
  .hk-bolum{ margin-top:44px; font-size:20px; }
  .hk-ekip{ grid-template-columns:1fr; gap:0; }
  .hk-ekip li:nth-child(2){ border-top:1px solid rgba(255,255,255,.14); }
}

/* ---------- İLETİŞİM: kişiler ---------- */
/* Sağ sütun sağa hizalı (.ky-sag); kişi kartları da aynı hizayı sürdürür. */
/* Kişiler kendi ızgara satırında; .ky-sag yatay flex olduğu için oraya
   konulursa sosyal bağlantıların yanına kayıyordu. */
.ky-kisiler{ margin-top:64px; padding-top:34px; border-top:1px solid rgba(255,255,255,.16); }
.ky-kisi{ padding-inline:10px; }
.ky-kisi .ad{ font-size:16px; font-weight:500; line-height:1.4; margin:0; }
.ky-kisi .unvan{ font-size:12px; letter-spacing:.08em; text-transform:uppercase;
  color:rgba(255,255,255,.5); margin:2px 0 6px; }
.ky-kisi a{ font-size:14px; color:inherit; text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,.28); padding-bottom:2px;
  transition:border-color .3s; }
.ky-kisi a:hover{ border-bottom-color:#fff; }

@media (max-width:900px){
  .ky-kisiler{ margin-top:44px; padding-top:26px; }
  .ky-kisi + .ky-kisi{ margin-top:22px; }
}

/* ---------- YAPIŞKAN ALT ÇUBUK ---------- */
/* Kısa sayfalarda (örn. içeriği az bir hizmet sayfası) alt çubuk ekranın
   ortasında kalıyordu, altında boşluk oluyordu. Gövde dikey esnek kutu olunca
   çubuk her zaman en alta oturur; uzun sayfalarda davranış değişmez. */
body{ min-height:100svh; display:flex; flex-direction:column; }
body > main{ flex:1 0 auto; }
body > .foot-bilgin{ margin-top:auto; flex-shrink:0; }

/* ---------- İLETİŞİM SATIRLARI — ikonlu ---------- */
.ky-satirlar.ikonlu a, .ky-satirlar.ikonlu .saat{
  display:flex; align-items:center; gap:10px;
}
.ky-satirlar.ikonlu svg{
  width:17px; height:17px; flex:none;
  stroke:currentColor; fill:none; stroke-width:1.5;
  stroke-linecap:round; stroke-linejoin:round;
  opacity:.75;
}
.ky-satirlar.ikonlu a:hover svg{ opacity:1; }

/* ---------- HİZMET SAYFASI: okunur metin ölçüsü ---------- */
/* .pj-bilgi .alt proje sayfasında 12px kalın bir ETİKET; hizmet sayfasında ise
   giriş paragrafı olarak kullanılıyor ve o ölçüde başlık altı yazı gibi duruyordu.
   Yalnızca hizmet sayfasında büyütülüyor — proje sayfasının ölçüsü korunuyor. */
.single-hizmet .pj-bilgi .alt{
  font-size:clamp(17px,1.45vw,21px); font-weight:400; line-height:1.55;
  color:#313139; margin:0 0 26px; max-width:52ch;
}
.hz-metin p{ font-size:clamp(15px,1.1vw,17px); line-height:1.75; color:#4A4A52;
  max-width:60ch; }
.hz-metin p + p{ margin-top:18px; }

/* ---------- HAKKIMIZDA: bölüm başlıkları ---------- */
/* .ky-blok h2 (18px/700) daha özgül olduğu için .hk-bolum'u eziyordu;
   h2.hk-bolum ile eşitlenip öne geçiriliyor. */
.ky-blok h2.hk-bolum{
  font-size:clamp(24px,2.4vw,32px); font-weight:400; line-height:1.2;
  letter-spacing:.005em; margin:96px 0 28px; padding-bottom:16px;
  border-bottom:1px solid rgba(255,255,255,.22);
}
@media (max-width:900px){
  .ky-blok h2.hk-bolum{ font-size:22px; margin:60px 0 22px; }
}

/* ---------- MARKA GÖRSELİ: koyu zeminli sayfalar ---------- */
/* Menü rengi normalde .head.on-dark ile belirlenir; o sınıf yalnızca menünün
   ALTINDA koyu bir bölüm varken eklenir. Hakkımızda/İletişim'de ise menü koyu
   bir bölümün üstünde değil, sayfanın kendi koyu zemininde durur — eski HTML
   yazı rengini gövdeden kalıtıyordu, GÖRSEL kalıtamaz. Bu yüzden gövde sınıfına
   göre de açık sürüme geçiliyor. Amblem de aynı sorunu taşıyordu. */
body.koyu-sayfa .brand .yazi-koyu,
body.koyu-sayfa .brand .mark-koyu{ display:none; }
body.koyu-sayfa .brand .yazi-acik,
body.koyu-sayfa .brand .mark-acik{ display:block; }

/* NOT: "kaydırınca açık zemine dönerse koyu logoya geç" kuralı KALDIRILDI.
   Üst çubuk artık kaydırıldığında her zaman koyu; logo da her zaman açık sürüm.
   Eski kural daha özgül olduğu için yeni davranışı eziyordu. */

/* ================= DOKUNMATİK CİHAZ DÜZELTMELERİ ================= */

/* 1) Dokunulan öğede çıkan mavi kutu (tarayıcı varsayılanı) kapatıldı.
      Metin seçimi engellenmiyor — yalnızca tıklanabilir öğelerde. */
a, button, summary, [role="button"], .pr-mask, .sl-serit button, .plan img{
  -webkit-tap-highlight-color:transparent;
}
a, button, summary, [role="button"], .pr-mask, .burger, .drop-btn, .lang{
  -webkit-touch-callout:none;
  user-select:none; -webkit-user-select:none;
}

/* 2) Proje kartlarındaki grilik dokunmatikte kalkmıyordu.
      Kapak iki katmandan oluşuyor: üstteki gri, HOVER'da kaybolup renklisini
      açıyor. Dokunmatik cihazda hover olmadığı için kart sonsuza kadar gri
      kalıyordu. Fare olmayan cihazlarda renkli katman doğrudan gösteriliyor. */
@media (hover: none){
  /* NOT: proje kartlarının kuralı projeler.css'te — o dosya main.css'ten SONRA
     yüklendiği için aynı özgüllükteki kural burada yazılırsa eziliyordu. */
  .kisi-foto img, .sy-kisi .foto img, .sy-kurucu .portre img, .ky-kisi .portre img{
    filter:none;
  }
}

/* 3) Kaydırıldığında üst çubuk HER ZAMAN koyu.
      Eskiden altındaki bölümün tonuna göre siyah/beyaz arasında gidip
      geliyordu; sayfa boyunca yanıp sönme etkisi yaratıyordu. */
.head.is-solid{ background:#191919; border-bottom-color:rgba(255,255,255,.14); }
.head.is-solid, .head.is-solid .nav a, .head.is-solid .drop-btn, .head.is-solid .lang{
  color:#fff;
}
/* Marka görseli de sabit: koyu çubukta daima açık sürüm. */
.head.is-solid .brand .yazi-koyu, .head.is-solid .brand .mark-koyu{ display:none; }
.head.is-solid .brand .yazi-acik, .head.is-solid .brand .mark-acik{ display:block; }

/* ---------- DOKUNMA HEDEFİ BÜYÜKLÜKLERİ ---------- */
/* Mobil menüdeki hizmet satırları 21px yüksekliğindeydi; parmakla isabet
   ettirmek zordu. Görsel boyut değişmeden tıklama alanı büyütülüyor. */
.panel .alt-liste a{ padding:9px 0; display:block; }
.panel > a{ padding:6px 0; }

/* Paylaş ikonları 20x20'ydi; ikon boyutu aynı kalıp alan genişletiliyor. */
@media (hover: none){
  .pj-paylas{ gap:6px; }
  .pj-paylas a{ width:44px; height:44px; margin:-12px; }
}


/* Giriş ekranındaki logo artık <h1> içinde (sayfanın başlığı o).
   Tarayıcının h1 varsayılanları düzeni bozmasın diye sıfırlanıyor.

   DİKKAT — buraya `img{ width:100% }` YAZMA.
   Bu dosyada `.giris-logo img` (26vw/310px) daha ÖNCE geliyor ve aynı
   özgüllükte; sonradan yazılan genişlik onu ezip logoyu ekran boyuna
   çıkarıyor. Bir kez yaşandı ve canlıda göründü. Görselin ölçüsü
   `.giris-logo img` kuralına ait, burası yalnızca h1 varsayılanlarını temizler. */
.giris-baslik{ margin:0; padding:0; font-size:inherit; font-weight:inherit; line-height:0; }


/* ---------- HAKKIMIZDA: kurucular ----------
   Düzen: üç kurucu ALT ALTA, portre SOLDA sabit ölçüde, biyografi sağda.

   TİPOGRAFİ (bilgin referansı): ad ile gövde metni birbirinden AYRILMALI.
   Önceden ad 18px/400, gövde 17px/400 idi — neredeyse aynıydı, hiyerarşi yoktu.
   Şimdi ad 600, gövde 300; ayrıca gövde küçültülüp soluklaştırıldı.
   Montserrat'ta 300/400/500/600 yüklü, 700 yüklenmiyor — 600 kullanılıyor.

   PORTRE SABİT: üçü de 220x270 (kaynak oranı 0.814). Satır yüksekliğince
   uzatılırsa her biyografi farklı uzunlukta olduğu için üç portre üç ayrı
   orana kırpılıyor; sabit ölçü bunu engelliyor.

   METİN GENİŞLİĞİ: blok, içinde durduğu 8 sütunluk alandan taşıp satırın 12
   sütununu kaplıyor (8/12 -> %150). Yalnız geniş ekranda. */
.hk-kurucular{
  display:grid; grid-template-columns:1fr; gap:64px; margin:8px 0 0;
}
.hk-kurucu{
  display:grid;
  grid-template-columns:220px minmax(0, 1fr);
  column-gap:48px;
  align-items:start;
}
.hk-portre{
  grid-column:1; grid-row:1 / span 99;
  width:220px; aspect-ratio:220 / 270;
  align-self:start;
  overflow:hidden; background:#2a2a2a; margin:0;
}
.hk-portre img{ width:100%; height:100%; object-fit:cover; object-position:50% 22%; display:block; }
.hk-kurucu > :not(.hk-portre){ grid-column:2; }

/* Ad — kalın, gövdeden belirgin biçimde ayrı */
.hk-kurucu .hk-kisi{
  display:block; margin:0 0 4px;
  font-size:15px; font-weight:600; line-height:1.35; letter-spacing:.02em;
  color:#fff;
}
/* Unvan — adın hemen altında, kendi satırında */
.hk-kurucu .hk-kisi .unvan{
  display:block; margin:5px 0 0;
  font-size:11px; font-weight:400; line-height:1.4; letter-spacing:.1em;
  text-transform:uppercase; color:rgba(255,255,255,.5);
}
/* Gövde — ince ve küçük */
.hk-kurucu p{
  font-size:14px; font-weight:300; line-height:1.66; letter-spacing:0;
  color:rgba(255,255,255,.78); max-width:none; margin:0 0 14px;
}
.hk-kurucu p:first-of-type{ margin-top:16px; }
.hk-kurucu p:last-child{ margin-bottom:0; }

@media (min-width:1100px){
  .hk-kurucular{ width:150%; max-width:none; }
}

@media (max-width:860px){
  .hk-kurucular{ gap:48px; width:auto; }
  .hk-kurucu{ grid-template-columns:1fr; row-gap:20px; }
  .hk-portre{ grid-column:1; grid-row:auto; width:180px; }
  .hk-kurucu > :not(.hk-portre){ grid-column:1; }
}


/* ---------- HAKKIMIZDA: sayfa başlığı ve giriş metni ----------
   bilgin ölçeği: başlık KALIN ve küçük, gövde metni İNCE ve küçük.
   Önceden başlık 26px/400, giriş metni 17px/400 idi — ikisi de aynı ağırlıkta,
   aralarında hiyerarşi yoktu. Kurucu bloklarıyla da aynı ölçüye getirildi.

   .ky-blok h1 kuralı proje.css'te 26px/700 tanımlı ama font ailesi kuralı
   ağırlığı 400'e düşürüyordu; burada ikisi de açıkça yazılıyor. */
.ky-blok.ky-ust h1{
  font-size:18px; font-weight:600; line-height:1.4; letter-spacing:.01em;
  color:#fff; margin:0 0 30px;
}
.ky-govde > p{
  font-size:14px; font-weight:300; line-height:1.66;
  color:rgba(255,255,255,.78); margin:0 0 16px;
}

/* Bölüm başlığı ("Hakkında", "Ekip Arkadaşlarımız"):
   üst taraftaki tanıtım ile ortakları AYIRAN geniş boşluk. */
.ky-govde h2.hk-bolum,
.ky-blok h2.hk-bolum{
  font-size:15px; font-weight:600; line-height:1.4; letter-spacing:.02em;
  color:#fff; margin:104px 0 44px; padding:0; border:0;
}
.ky-govde h2.hk-bolum:first-of-type{ margin-top:104px; }
.hk-kurucular{ margin-top:0; }

@media (max-width:860px){
  .ky-blok.ky-ust h1{ font-size:17px; margin-bottom:24px; }
  .ky-govde h2.hk-bolum,
  .ky-blok h2.hk-bolum{ margin:68px 0 30px; }
}


/* ---------- HEADER LOGOSU: her zaman lacivert (orijinal) ----------
   MÜŞTERİ KARARI: header logosu her zaman LACİVERT sürüm (1 Eyl 2026).
   Kartvizitteki orijinal renk istendi.

   ÖNCESİ: koyu zeminde (`.head.on-dark` / `.head.is-solid`) beyaz sürüme
   geçiliyordu; üst çubuk her zaman koyu olduğu için pratikte hep beyaz
   görünüyordu.

   NOT — bu bilinçli bir tercih, hata değil: üst çubuk #191919, logo lacivert;
   kontrast düşük. Beyaz sürüm (`*-beyaz.png`) dosyalarda duruyor, geri dönmek
   için bu blok silinmesi yeterli. */
.brand .mark-koyu,
.head.on-dark .brand .mark-koyu,
.head.is-solid .brand .mark-koyu{ display:block; }
.brand .mark-acik,
.head.on-dark .brand .mark-acik,
.head.is-solid .brand .mark-acik{ display:none; }

.brand .yazi-koyu,
.head.on-dark .brand .yazi-koyu,
.head.is-solid .brand .yazi-koyu{ display:block; }
.brand .yazi-acik,
.head.on-dark .brand .yazi-acik,
.head.is-solid .brand .yazi-acik{ display:none; }

/* `body.koyu-sayfa .brand .mark-acik` kuralı (1 eleman + 3 sınıf) yukarıdakilerden
   DAHA ÖZGÜL; sırayla ezilemiyor. Aynı özgüllükte karşılığı yazılıyor. */
body.koyu-sayfa .brand .mark-koyu,
body.koyu-sayfa .brand .yazi-koyu{ display:block; }
body.koyu-sayfa .brand .mark-acik,
body.koyu-sayfa .brand .yazi-acik{ display:none; }


/* İletişim: numaranın yanındaki kişi adı — numaradan daha sönük. */
.ky-satirlar .kim{
  font-style:normal; font-weight:400; margin-left:10px;
  color:rgba(255,255,255,.55); font-size:.86em; letter-spacing:.02em;
}


/* Harita kapalıyken görünen panel (tıklayınca yüklenir). */
.ky-harita-kapali{
  display:flex; align-items:center; justify-content:center;
  background:#101010; border-bottom:1px solid rgba(255,255,255,.08);
}
.ky-harita-kapali .hrt-on{ text-align:center; padding:32px 24px; max-width:520px; }
.hrt-adres{ font-size:14px; font-weight:300; line-height:1.6;
  color:rgba(255,255,255,.8); margin:0 0 20px; }
.hrt-ac{
  display:inline-flex; align-items:center; gap:9px;
  font:inherit; font-size:13px; font-weight:500; letter-spacing:.04em;
  color:#fff; background:transparent; cursor:pointer;
  border:1px solid rgba(255,255,255,.45); border-radius:2px; padding:11px 20px;
  transition:border-color .3s, background-color .3s;
}
.hrt-ac:hover{ border-color:#fff; background:rgba(255,255,255,.07); }
.hrt-ac svg{ width:16px; height:16px; flex:none;
  fill:none; stroke:currentColor; stroke-width:1.7;
  stroke-linecap:round; stroke-linejoin:round; }
.hrt-not{ font-size:11px; font-weight:300; line-height:1.55;
  color:rgba(255,255,255,.45); margin:16px 0 0; }
.hrt-baglanti{ display:inline-block; margin-top:14px; font-size:13px;
  text-decoration:underline; text-underline-offset:3px; }