/* ═══════════════════════════════════════════════════════════════
   premium.css — modern-option.css'ten SONRA yüklenir.
   Amaç: üst menüyü geri getirmek, hero okunabilirliğini çözmek,
   menü panelini ve iletişim kartını sadeleştirmek.
   ═══════════════════════════════════════════════════════════════ */

/* ── 1. ÜST MENÜ ────────────────────────────────────────────────
   Daha önce 1180px altında hamburgere düşüyordu. Artık 901px'ten
   itibaren başlıklar görünür; dar aralıkta tipografi sıkışır. */
@media(min-width:901px){
  body:not(.modern-option) .nav-links{display:flex}
  body:not(.modern-option) .nav-iletisim{display:inline-flex}
  body:not(.modern-option) .menu-ac{display:none}
}
@media(min-width:901px) and (max-width:1300px){
  body:not(.modern-option) .marka-ad{font-size:.9rem;letter-spacing:.03em}
  body:not(.modern-option) .nav-links{gap:clamp(.8rem,1.8vw,1.7rem)}
  body:not(.modern-option) .nav-links a{font-size:.55rem;letter-spacing:.13em}
  body:not(.modern-option) .nav-tel{font-size:.66rem}
  body:not(.modern-option) .nav-iletisim{min-width:0;padding:.66rem .9rem;
    font-size:.55rem;letter-spacing:.13em}
}

/* ── 2. HERO ────────────────────────────────────────────────────
   Sorun: terazi de metin de tam ortadaydı, üst üste biniyordu.
   Çözüm: metin sola hizalanır, fotoğrafın öznesi sağa kaydırılır,
   araya soldan sağa güçlü bir geçiş konur. Metin temiz zemine oturur. */
@media(min-width:901px){
  body:not(.modern-option) .hero-v0c .hero-split{
    grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)!important;
    justify-content:start!important;text-align:left!important;align-items:center}
  body:not(.modern-option) .hero-v0c .hero-metin{
    width:100%!important;margin:0!important;max-width:33rem;text-align:left!important}
  body:not(.modern-option) .hero-v0c :is(h1,.hero-alt){
    text-align:left!important;margin-left:0!important;margin-right:0!important}
  body:not(.modern-option) .hero-v0c h1 em{margin-left:0!important;margin-right:0!important}
  body:not(.modern-option) .hero-v0c .hero-etiket{justify-content:flex-start!important}
  body:not(.modern-option) .hero-v0c .hero-btnlar{justify-content:flex-start!important}

  body:not(.modern-option) .hero-zemin img{object-position:70% 45%}
  body:not(.modern-option) .hero-zemin-perde{
    background:
      linear-gradient(90deg,
        rgba(9,11,13,.95) 0%, rgba(9,11,13,.9) 25%, rgba(9,11,13,.66) 46%,
        rgba(9,11,13,.26) 68%, rgba(9,11,13,.18) 84%, rgba(9,11,13,.38) 100%),
      linear-gradient(180deg,
        rgba(9,11,13,.44) 0%, rgba(9,11,13,.1) 34%, rgba(9,11,13,.16) 66%, rgba(9,11,13,.66) 100%)}
  /* metin artık temiz zeminde; gölgeye gerek kalmadı */
  body:not(.modern-option) .hero-v0c h1{text-shadow:0 1px 2px rgba(6,8,10,.3)}
  body:not(.modern-option) .hero-v0c :is(.hero-alt,.hero-etiket){text-shadow:none}
}

/* Dar ekran: metin ortada kalır, perde her yerde güçlü olur */
@media(max-width:900px){
  body:not(.modern-option) .hero-zemin img{object-position:58% 44%}
  body:not(.modern-option) .hero-zemin-perde{
    background:
      linear-gradient(180deg,
        rgba(9,11,13,.72) 0%, rgba(9,11,13,.58) 30%, rgba(9,11,13,.6) 62%, rgba(9,11,13,.8) 100%)}
}

/* ── 3. MENÜ PANELİ ─────────────────────────────────────────────
   Başlıklar aşırı büyüktü (6rem'e kadar çıkıyordu). Ölçeklendi. */
body .menu-links{gap:.1rem}
body .menu-links a{font-size:clamp(1.45rem,3vw,2.5rem)!important;
  line-height:1.16!important;letter-spacing:-.018em!important;padding:.34rem 0}
body .menu-marka{font-size:.78rem;letter-spacing:.14em}
@media(max-width:620px){
  body .menu-links a{font-size:clamp(1.3rem,6.4vw,1.9rem)!important}
}

/* ── 4. İLETİŞİM ────────────────────────────────────────────────
   Görüşme kartı ve harita yan yana iki ayrık, yuvarlak köşeli kart.
   Tüm genişliği kaplamasın diye önceki boyutun ~%80'inde, ortalı. */
body:not(.modern-option) #iletisim .il-grid{
  /* kartların boyutu aynı kalır; aralık 2 cm açılır, böylece görüşme
     kartı 1 cm sola, harita 1 cm sağa kayar */
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:calc(clamp(1.25rem,2.4vw,2rem) + 2cm);
  align-items:stretch;max-width:calc(990px + 2cm);margin:clamp(2rem,4vw,3rem) auto 0}
body:not(.modern-option) #iletisim .il-bilgi{
  padding:clamp(1.75rem,3vw,2.6rem);background:#f1f1f1;
  border:1px solid rgba(245,244,240,.16);border-radius:24px;
  box-shadow:0 30px 80px rgba(0,0,0,.28)}
body:not(.modern-option) #iletisim .il-ozet{
  display:grid;grid-template-columns:minmax(0,1.3fr) minmax(150px,.7fr);gap:1.6rem 2.5rem;
  padding-bottom:2rem;border-bottom:1px solid rgba(20,20,20,.12)}
body:not(.modern-option) #iletisim .il-bilgi .il-satir{padding:0;border:0}
body:not(.modern-option) #iletisim .il-bilgi .il-satir small{
  margin-bottom:.75rem;font-size:.56rem;letter-spacing:.2em;text-transform:uppercase;color:#777}
body:not(.modern-option) #iletisim .il-bilgi .il-satir p{
  color:#181818;font-size:1.05rem;line-height:1.6}
body:not(.modern-option) #iletisim .il-bilgi .il-btnlar{
  grid-column:1/-1;display:flex;flex-wrap:wrap;gap:.55rem;margin:0}
body:not(.modern-option) #iletisim .il-bilgi .il-btn{
  min-height:43px;padding:.72rem 1.1rem;border-radius:10px!important;
  font-size:.61rem;letter-spacing:.1em;justify-content:center;white-space:nowrap}
body:not(.modern-option) #iletisim .il-bilgi .il-form.ref-form{
  display:grid;grid-template-columns:1fr 1fr;gap:1rem 1.15rem;
  margin-top:2rem;padding:0;border:0}
body:not(.modern-option) #iletisim .il-bilgi .il-form.ref-form label{
  font-size:.59rem;letter-spacing:.08em;color:#686868}
body:not(.modern-option) #iletisim .il-bilgi .il-form.ref-form :is(input,select,textarea){
  margin-top:.5rem;padding:.82rem .9rem;border:1px solid rgba(20,20,20,.17);
  border-radius:10px;background:#fff;color:#181818;box-shadow:none}
/* Safari <select>'i yerel stille çizip yükseklik/padding'i yok sayıyordu;
   ad kutusu kalın, konu kutusu ince kalıyordu. İkisine de sabit yükseklik
   verip select'in yerel görünümünü kapatıyoruz, oku kendimiz çiziyoruz. */
body:not(.modern-option) #iletisim .il-bilgi .il-form.ref-form :is(input,select){
  height:46px;min-height:46px;padding-block:0;font-size:15px;line-height:1.2}
body:not(.modern-option) #iletisim .il-bilgi .il-form.ref-form select{
  -webkit-appearance:none;appearance:none;padding-right:2.4rem;cursor:pointer;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23686868' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right .95rem center}
body:not(.modern-option) #iletisim .il-bilgi .il-form.ref-form textarea{min-height:112px;height:112px}
body:not(.modern-option) #iletisim .il-form .ref-message,
body:not(.modern-option) #iletisim .il-form .ref-submit,
body:not(.modern-option) #iletisim .il-form .ref-form-note{grid-column:1/-1}
body:not(.modern-option) #iletisim .il-form .ref-submit .il-btn{width:100%;min-height:46px}
body:not(.modern-option) #iletisim .il-form .ref-form-note{margin:0;color:#777;font-size:.65rem}

/* Harita — canlı Google Haritalar embed'i. Statik karo mozaiği
   bulanık ve amatör duruyordu; gerçek harita her zaman native
   çözünürlükte, keskin render edilir. Site genelinin sakin/mono
   diliyle uyumlu kalsın diye hafif gri tonlamayla yumuşatılır. */
body:not(.modern-option) #iletisim .harita{
  /* soldaki formla aynı yükseklikte — artık canlı harita olduğu için
     büyütmek kaliteyi düşürmez, boş alan bırakmaktansa dolduruyoruz */
  position:relative;display:block;width:100%;aspect-ratio:auto!important;
  min-height:clamp(300px,32vw,380px);
  align-self:stretch;margin:0;border:1px solid rgba(245,244,240,.16);border-radius:24px;
  overflow:hidden;background:#e6e6e6;box-shadow:0 30px 80px rgba(0,0,0,.28)}
body:not(.modern-option) #iletisim .harita iframe{
  display:block;width:100%;height:100%;border:0;
  filter:grayscale(.88) contrast(1.08) brightness(.99)}

/* Zorunlu alan işareti */
body:not(.modern-option) #iletisim .zorunlu{color:#181818;font-weight:600}
body:not(.modern-option) #iletisim .ref-form-note a{color:inherit;text-decoration:underline;text-underline-offset:2px}

/* Harita önizlemesi — Google yalnızca "Haritayı göster" ile yüklenir */
body:not(.modern-option) #iletisim .harita-onizleme{
  position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:.5rem;padding:2rem 1.5rem 3.5rem;text-align:center;color:#181818;
  background:
    linear-gradient(rgba(20,20,20,.05) 1px,transparent 1px) 0 0/28px 28px,
    linear-gradient(90deg,rgba(20,20,20,.05) 1px,transparent 1px) 0 0/28px 28px,
    #ececec}
body:not(.modern-option) #iletisim .harita-pin{
  width:30px;height:30px;fill:none;stroke:#181818;stroke-width:1.5;margin-bottom:.35rem}
body:not(.modern-option) #iletisim .harita-baslik{
  margin:0;font-size:.56rem;letter-spacing:.2em;text-transform:uppercase;color:#777}
body:not(.modern-option) #iletisim .harita-adres{
  margin:0 0 .9rem;font-family:var(--serif);font-size:1.02rem;line-height:1.55;color:#181818}
body:not(.modern-option) #iletisim .harita-goster{
  min-height:43px;padding:.8rem 1.4rem;border:1px solid #181818;border-radius:10px;
  background:#181818;color:#fafafa;font:inherit;font-size:.61rem;letter-spacing:.12em;
  text-transform:uppercase;cursor:pointer;transition:background .3s ease,color .3s ease}
body:not(.modern-option) #iletisim .harita-goster:hover{background:transparent;color:#181818}
body:not(.modern-option) #iletisim .harita-dis{
  margin-top:.35rem;font-size:.66rem;color:#555;text-decoration:underline;text-underline-offset:3px}
body:not(.modern-option) #iletisim .harita-not{
  position:absolute;left:1.5rem;right:1.5rem;bottom:1.1rem;margin:0;
  font-size:.6rem;line-height:1.5;color:#8a8a8a}

/* Açık zemin — SSS'i açık renkli modellerde iletişim aynı zeminle devam eder */
body:not(.modern-option) #iletisim.iletisim--acik{background:#f1f1f1;color:#141414;border-bottom:0;
  /* SSS aynı zeminde bittiği için onun alt dolgusu yeterli; iki dolgu üst üste
     200px'lik boşluk oluşturuyordu */
  padding-top:0}
body:not(.modern-option) #iletisim.iletisim--acik h2{color:#141414}
body:not(.modern-option) #iletisim.iletisim--acik .metin{color:#5f5f5f!important}
body:not(.modern-option) #iletisim.iletisim--acik .kural{background:#141414}
body:not(.modern-option) #iletisim.iletisim--acik .il-bilgi{
  background:#fff;border-color:rgba(20,20,20,.08);box-shadow:0 24px 60px rgba(20,20,20,.08)}
body:not(.modern-option) #iletisim.iletisim--acik .harita{
  border-color:rgba(20,20,20,.08);box-shadow:0 24px 60px rgba(20,20,20,.08)}

@media(max-width:960px){
  body:not(.modern-option) #iletisim .il-grid{grid-template-columns:1fr;gap:clamp(1.25rem,2.4vw,2rem)}
  body:not(.modern-option) #iletisim .harita{height:320px;min-height:0}
}
@media(max-width:620px){
  body:not(.modern-option) #iletisim .il-bilgi{padding:1.6rem}
  body:not(.modern-option) #iletisim .il-ozet,
  body:not(.modern-option) #iletisim .il-bilgi .il-form.ref-form{grid-template-columns:1fr}
  body:not(.modern-option) #iletisim .il-bilgi .il-btnlar{grid-column:auto}
  body:not(.modern-option) #iletisim .harita{height:260px;min-height:0}
}


/* ── ÇEREZ BANDI ────────────────────────────────────────────────
   Reddet ve Kabul et bilerek aynı ağırlıkta: KVKK çerez rehberi
   reddetmenin kabul etmek kadar kolay olmasını ister. */
.cerez-bant{
  position:fixed;left:50%;bottom:clamp(12px,2.5vw,24px);transform:translateX(-50%);
  z-index:9000;width:min(640px,calc(100% - 24px));display:flex;align-items:center;gap:1.1rem 1.4rem;
  padding:1rem 1rem 1rem 1.3rem;border-radius:16px;background:#181818;color:#f1f1ef;
  border:1px solid rgba(245,244,240,.12);box-shadow:0 20px 50px rgba(0,0,0,.28);
  font-family:'Manrope',Arial,sans-serif;animation:cerez-gir .45s ease both}
.cerez-bant p{margin:0;flex:1;font-size:.78rem;line-height:1.6;color:rgba(241,241,239,.86)}
.cerez-bant a{color:#f1f1ef;text-decoration:underline;text-underline-offset:2px}
.cerez-dugmeler{display:flex;gap:.5rem;flex:none}
.cerez-dugmeler button{
  min-height:40px;padding:.6rem 1.05rem;border-radius:10px;border:1px solid rgba(245,244,240,.4);
  background:transparent;color:#f1f1ef;font:inherit;font-size:.66rem;letter-spacing:.1em;
  text-transform:uppercase;cursor:pointer;transition:background .25s ease,color .25s ease}
.cerez-dugmeler button:hover,.cerez-dugmeler button:focus-visible{background:#f1f1ef;color:#181818}
@keyframes cerez-gir{from{opacity:0;transform:translate(-50%,12px)}to{opacity:1;transform:translate(-50%,0)}}
/* Telefonda altta sabit "Bizi arayın / WhatsApp" çubuğu (57px, ≤760px) var;
   bant onun üstüne binmesin, hemen üstünde dursun. */
@media(max-width:760px){.cerez-bant{bottom:calc(57px + 10px + env(safe-area-inset-bottom,0px))}}
@media(max-width:620px){
  .cerez-bant{flex-direction:column;align-items:stretch}
  .cerez-dugmeler button{flex:1}
}
@media(prefers-reduced-motion:reduce){.cerez-bant{animation:none}}
/* Sayfa altındaki "Çerez tercihleri" — link görünümünde düğme */
.cerez-tercih-link{padding:0;border:0;background:none;color:inherit;font:inherit;
  text-decoration:underline;text-underline-offset:2px;cursor:pointer}
