/* Akova Yapı & Dekorasyon — stil dosyası
   Mobil öncelikli (390px taban), yerel fontlar, harici bağımlılık yok.
   Palet: --gece #12100E · --isik #F5EFE4 · --amber #E8A34D · --kul #9A8F80
   Tipografi: Space Grotesk 500/700 (başlık) + Inter (gövde) */

@font-face{font-family:'Space Grotesk';font-weight:500;font-style:normal;font-display:swap;
  src:url("../fonts/space-grotesk-500-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+011E-011F,U+015E-015F,U+0130,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD;}
@font-face{font-family:'Space Grotesk';font-weight:500;font-style:normal;font-display:swap;
  src:url("../fonts/space-grotesk-500-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-024F,U+1E00-1EFF,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Space Grotesk';font-weight:700;font-style:normal;font-display:swap;
  src:url("../fonts/space-grotesk-700-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+011E-011F,U+015E-015F,U+0130,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD;}
@font-face{font-family:'Space Grotesk';font-weight:700;font-style:normal;font-display:swap;
  src:url("../fonts/space-grotesk-700-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-024F,U+1E00-1EFF,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-weight:400 700;font-style:normal;font-display:swap;
  src:url("../fonts/inter-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+011E-011F,U+015E-015F,U+0130,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-weight:400 700;font-style:normal;font-display:swap;
  src:url("../fonts/inter-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-024F,U+1E00-1EFF,U+2C60-2C7F,U+A720-A7FF;}

:root{
  --gece:#12100E;
  --gece-2:#1B1815;
  --gece-3:#241F1A;
  --isik:#F5EFE4;
  --amber:#E8A34D;
  --amber-2:#F2C888;
  --kul:#9A8F80;
  /* #6A6157 kullanmayın: kontrast 3.13 ile AA'nın altında kalır. */
  --kul-koyu:#8A8175;
  --cizgi:rgba(245,239,228,.12);
  --cizgi-koyu:rgba(18,16,14,.1);
  --yesil:#3F7D5B;
  --baslik:'Space Grotesk','Inter',system-ui,sans-serif;
  --govde:'Inter',system-ui,'Segoe UI',sans-serif;
  --kenar:20px;              /* mobil kenar boşluğu */
  /* Köşeler keskin. Daire ve çubuk biçimli öğeler ayrı, onlar 999px. */
  --r:0;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{
  scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%;
  /* Sabit üst bar ve mobil CTA çubuğu odaklanan/hedeflenen öğeyi örtmesin (WCAG 2.2) */
  scroll-padding-top:76px;
  scroll-padding-bottom:84px;
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  font-family:var(--govde);background:var(--gece);color:var(--isik);
  line-height:1.6;font-size:16px;-webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
/* Zemin dokusu: doğrama kayıtlarını andıran ızgara + ince grain.
   Tek sabit katman; bölümler yarı saydam olduğu için altından görünür. */
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(245,239,228,.045) 0 1px,transparent 1px 100%) 0 0/25% 100%,
    linear-gradient(180deg,rgba(245,239,228,.028) 0 1px,transparent 1px 100%) 0 0/100% 340px,
    radial-gradient(90% 55% at 78% 0%,rgba(232,163,77,.07),transparent 60%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E");
}
/* İçerik zemin dokusunun üstünde kalır.
   dialog hariç tutulmalı: top layer'da relative, absolute'a dönüşüp
   tarayıcının dialog:modal{position:fixed} kuralını ezer; panel viewport
   yerine belgenin tepesine konumlanır ve sayfa yukarı sıçrar. */
body > *:not(dialog){position:relative;z-index:1}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:6px}
h1,h2,h3,h4{font-family:var(--baslik);font-weight:700;line-height:1.05;letter-spacing:-.02em;text-wrap:balance}
p,li,blockquote,figcaption{text-wrap:pretty}

/* Klavye kullanıcısı için içeriğe atlama — yalnızca odaklanınca görünür */
.atla{
  position:fixed;top:0;left:50%;transform:translate(-50%,-120%);z-index:100;
  background:var(--amber);color:var(--gece);padding:12px 22px;border-radius:0 0 12px 12px;
  font-family:var(--baslik);font-weight:500;font-size:15px;
  transition:transform .2s ease;
}
.atla:focus-visible{transform:translate(-50%,0)}
@media (prefers-reduced-motion:reduce){.atla{transition:none}}

.wrap{width:100%;max-width:1200px;margin:0 auto;padding:0 var(--kenar)}
/* Kategori etiketi — yalnızca hizmet detay panelinde kullanılır. */
.eyebrow{
  font-family:var(--baslik);font-weight:500;font-size:13px;letter-spacing:.02em;
  color:var(--amber);display:inline-flex;align-items:center;gap:10px;
}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--amber)}
/* Hero'daki konum satırı: bilgi taşır, etiket değil */
.hero-yer{
  font-family:var(--baslik);font-weight:500;font-size:13.5px;letter-spacing:.02em;
  color:var(--amber);margin-bottom:16px;display:inline-flex;align-items:center;gap:10px;
}
.hero-yer::before{content:"";width:22px;height:1px;background:var(--amber)}

/* ============ ÜST BAR (mobil: kompakt; masaüstü: genişler) ============ */
.ustbar{
  position:fixed;top:0;left:0;right:0;z-index:60;
  display:flex;align-items:center;justify-content:space-between;
  padding:14px var(--kenar);
  background:linear-gradient(180deg,rgba(18,16,14,.82),rgba(18,16,14,0));
  /* padding geçişe alınmıyor: layout tetikler.
     Görsel etkiyi arka planın belirmesi taşıyor. */
  transition:background .4s ease,box-shadow .4s ease,backdrop-filter .4s ease;
}
.ustbar.sabit{
  background:rgba(18,16,14,.9);
  -webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);
  padding-top:10px;padding-bottom:10px;box-shadow:0 1px 0 var(--cizgi);
}
.logo{display:flex;align-items:center;gap:9px;font-family:var(--baslik);font-weight:700;font-size:18px}
.logo-mark{width:30px;height:30px;flex:none}
.logo b{color:var(--amber);font-weight:700}
.ust-nav{display:none}
.ust-ara{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--baslik);font-weight:500;font-size:14px;
  background:var(--amber);color:var(--gece);padding:9px 16px;border-radius:999px;
  transition:transform .18s ease,background .18s ease;
}
.ust-ara svg{flex:none}
.ust-ara:hover{transform:translateY(-2px);background:var(--amber-2)}

/* ============ HERO — imza: pencere ızgarası ışığı çerçeveler ============ */
.hero{
  position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;
  padding:0 0 34px;overflow:hidden;background:var(--gece);
}
.hero-foto{position:absolute;inset:0;z-index:0}
.hero-foto img{width:100%;height:100%;object-fit:cover;transform:scale(1.06)}
.hero-foto::after{ /* gün ışığından geceye geçen degrade — metin okunur kalsın */
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(18,16,14,.55) 0%,rgba(18,16,14,.15) 30%,rgba(18,16,14,.7) 72%,var(--gece) 100%),
    radial-gradient(120% 80% at 70% 20%,rgba(232,163,77,.22),transparent 55%);
}
/* Pencere kayıt ızgarası — cam bölmelerini andıran ince amber çizgiler */
.hero-izgara{position:absolute;inset:0;z-index:1;pointer-events:none}
.hero-izgara span{position:absolute;background:rgba(245,239,228,.14)}
/* Izgara konumları sabit dekoratif değerlerdir; inline style yerine burada. */
.hero-izgara .dik{top:0;bottom:0;width:1px}
.hero-izgara .yatay{left:0;right:0;height:1px}
.hero-izgara .dik:nth-of-type(1){left:33.33%}
.hero-izgara .dik:nth-of-type(2){left:66.66%}
.hero-izgara .yatay:nth-of-type(3){top:38%}
.hero-izgara .yatay:nth-of-type(4){top:70%}

/* @supports gerekli: Firefox'ta scroll-timeline kapalı.
   Desteklenmediğinde ızgara sabit kalır, içerik kaybolmaz. */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .hero-izgara .dik{
      animation:izgara-dik linear both;
      animation-timeline:view();
      animation-range:cover 0% cover 100%;
    }
    .hero-izgara .yatay{
      animation:izgara-yatay linear both;
      animation-timeline:view();
      animation-range:cover 0% cover 100%;
    }
    .hero-foto img{
      animation:hero-kay linear both;
      animation-timeline:view();
      animation-range:cover 0% cover 100%;
    }
  }
}
@keyframes izgara-dik{from{transform:translateY(-2%)}to{transform:translateY(4%)}}
@keyframes izgara-yatay{from{transform:translateY(-14px)}to{transform:translateY(26px)}}
@keyframes hero-kay{from{transform:scale(1.06) translateY(0)}to{transform:scale(1.06) translateY(-3%)}}
.hero-icerik{position:relative;z-index:2;width:100%}
/* svh sınırı kaldırılmamalı: 1366x768'de başlığın ilk satırı üst bardan taşar. */
.hero h1{
  font-size:clamp(40px,min(13vw,10.5svh),120px);letter-spacing:-.035em;
  text-shadow:0 2px 40px rgba(0,0,0,.4);
  text-wrap:balance;
}
.hero h1 .ince{font-weight:500;color:var(--amber)}
.hero-alt{
  margin-top:20px;display:flex;flex-direction:column;gap:22px;
}
.hero-metin{color:var(--isik);opacity:.9;font-size:16px;max-width:30ch}
.hero-butonlar{display:flex;flex-wrap:wrap;gap:12px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-family:var(--baslik);font-weight:500;font-size:15px;
  padding:15px 22px;border-radius:0;transition:transform .18s ease,background .18s ease,border-color .18s ease,color .18s ease;
  min-height:50px;
}
.btn svg{flex:none}
.btn-amber{background:var(--amber);color:var(--gece)}
.btn-amber:hover{transform:translateY(-2px);background:var(--amber-2)}
.btn-cam{background:rgba(245,239,228,.06);color:var(--isik);border:1px solid var(--cizgi);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.btn-cam:hover{transform:translateY(-2px);border-color:var(--amber);color:var(--amber)}
.hero-serit{
  margin-top:30px;display:flex;gap:26px;flex-wrap:wrap;
  padding-top:22px;border-top:1px solid var(--cizgi);
}
.hero-stat b{display:block;font-family:var(--baslik);font-weight:700;font-size:26px;color:var(--isik);font-variant-numeric:tabular-nums}
.hero-stat span{font-size:12px;color:var(--kul);letter-spacing:.02em}

/* ============ Kayan güven şeridi (marquee) ============ */
.marka-serit{
  background:var(--amber);color:var(--gece);overflow:hidden;
  border-top:1px solid rgba(18,16,14,.15);border-bottom:1px solid rgba(18,16,14,.15);
}
.marka-ray{display:flex;width:max-content;animation:kay 26s linear infinite}
.marka-ray span{
  font-family:var(--baslik);font-weight:700;font-size:15px;letter-spacing:.02em;
  padding:13px 0;white-space:nowrap;display:inline-flex;align-items:center;
}
.marka-ray span::after{content:"";width:6px;height:6px;border-radius:50%;background:var(--gece);margin:0 26px;opacity:.6}
@keyframes kay{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marka-ray{animation:none}}

/* ============ Genel bölüm ============ */
.bolum{padding:76px 0;position:relative}
/* content-visibility:auto eklemeyin: tahmini yükseklik 47–191px sapıyor
   ve kaydırma çubuğu oynuyor (CLS). Gerekirse ölçülmüş değerle. */
/* Bölüm başlığı: üstte kasa çizgisi, solda amber köşe işareti,
   arkada yumuşak ışık katmanı. */
.bolum-basli{position:relative;max-width:660px;margin-bottom:44px;padding-top:34px}
.bolum-basli::before{        /* üst kayıt + amber köşe */
  content:"";position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,var(--amber) 0 54px,var(--cizgi) 54px 100%);
}
.bolum-basli::after{         /* köşeden inen dikey kayıt */
  content:"";position:absolute;top:0;left:0;width:1px;height:26px;background:var(--amber);
}
.bolum-basli .isik{          /* camdan sızan ışık — başlığın kendi alanı */
  position:absolute;left:-12%;top:-16px;width:min(620px,92vw);height:250px;
  background:radial-gradient(52% 58% at 26% 42%,rgba(232,163,77,.13),transparent 72%);
  pointer-events:none;z-index:0;
}
.bolum-basli h2,.bolum-basli p{position:relative;z-index:1}
.bolum-basli h2{font-size:clamp(31px,7.4vw,56px);margin:0 0 14px;letter-spacing:-.028em}
.bolum-basli h2 .ince{font-weight:500;color:var(--amber)}
.bolum-basli p{color:var(--kul);font-size:16.5px;max-width:52ch}
@media (min-width:820px){.bolum-basli{padding-top:42px;margin-bottom:54px}}

/* ============ Hizmetler — büyük görsel kartlar, mobilde tek kolon ============ */
.hizmetler{background:transparent}
.hizmet-liste{display:grid;gap:16px}
/* Kartlar <button>: detay panelini açar. Tarayıcı varsayılanları sıfırlanır. */
.hkart{
  position:relative;border-radius:var(--r);overflow:hidden;isolation:isolate;
  min-height:280px;display:flex;flex-direction:column;justify-content:flex-end;
  background:var(--gece-2);
  width:100%;border:0;padding:0;margin:0;font:inherit;color:inherit;
  text-align:left;cursor:pointer;-webkit-appearance:none;appearance:none;
}
.hkart-foto{position:absolute;inset:0;z-index:-1}
.hkart-foto img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
/* Açık zeminli fotoğraflarda da okunurluk için alt bölge belirgin
   koyulaştırılır, üst yumuşak kalır. */
.hkart-foto::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,
    rgba(18,16,14,.10) 0%,
    rgba(18,16,14,.34) 42%,
    rgba(18,16,14,.80) 68%,
    rgba(18,16,14,.95) 100%);
}
.hkart:hover .hkart-foto img,.hkart:focus-within .hkart-foto img{transform:scale(1.06)}
/* @property şart: tipsiz custom property transition edilemez. */
@property --isik-aci{syntax:'<angle>';initial-value:0deg;inherits:false}
.hkart::after{
  content:"";position:absolute;inset:0;border-radius:var(--r);padding:1px;
  background:conic-gradient(from var(--isik-aci),
    transparent 0deg,rgba(232,163,77,.85) 60deg,rgba(242,200,136,.5) 110deg,transparent 200deg);
  /* yalnızca kenarlık görünsün: iç alanı maskeyle oy */
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  opacity:0;transition:opacity .35s ease,--isik-aci 1.1s ease;
  pointer-events:none;z-index:1;
}
.hkart:hover::after,.hkart:focus-visible::after{opacity:1;--isik-aci:300deg}
@media (prefers-reduced-motion:reduce){
  .hkart::after{transition:opacity .2s ease}
  .hkart:hover::after,.hkart:focus-visible::after{--isik-aci:0deg}
}

.hkart-ic{padding:24px;position:relative;z-index:2}
.hkart-no{font-family:var(--baslik);font-weight:500;font-size:12px;letter-spacing:.18em;color:var(--amber)}
.hkart h3{font-size:23px;margin:8px 0 8px}
/* Fotoğraf üstünde --kul fazla soluk kalır; okunurluk için açık ton. */
.hkart p{color:rgba(245,239,228,.82);font-size:14.5px;line-height:1.55;max-width:34ch}
.hkart h3,.hkart p{text-shadow:0 1px 12px rgba(18,16,14,.55)}
.hkart-ok{
  margin-top:16px;width:42px;height:42px;border-radius:50%;border:1px solid var(--cizgi);
  display:flex;align-items:center;justify-content:center;color:var(--isik);
  transition:background .25s ease,color .25s ease,border-color .25s ease,transform .25s ease;
}
.hkart:hover .hkart-ok{background:var(--amber);color:var(--gece);border-color:var(--amber);transform:rotate(-45deg)}

/* ============ İşler — yatay kaydırma şeridi (mobil dostu) ============ */
.isler{background:transparent}
.isler-ray{
  display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;
  margin:0 calc(var(--kenar) * -1);padding:0 var(--kenar) 14px;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;
}
.isler-ray::-webkit-scrollbar{display:none}
/* .is öğesinin kendisi <figure>'dır; kurallar doğrudan .is üzerinde. */
.is{
  flex:0 0 82%;max-width:340px;scroll-snap-align:start;
  border-radius:var(--r);overflow:hidden;aspect-ratio:3/4;position:relative;
}
.is img{width:100%;height:100%;object-fit:cover}
.is figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:20px 16px 16px;
  background:linear-gradient(transparent,rgba(18,16,14,.55) 30%,rgba(18,16,14,.92));
  font-size:14px;line-height:1.35;color:var(--isik);
}
.is figcaption b{display:block;font-family:var(--baslik);font-weight:500;font-size:11px;letter-spacing:.14em;color:var(--amber);margin-bottom:6px}

/* Yalnızca ekran okuyucunun gördüğü metin */
.gizli-yazi{
  position:absolute;width:1px;height:1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;
}

/* kare tıklanabilir: büyüteci açar */
.is{cursor:zoom-in;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.is:hover{transform:translateY(-4px)}
.is:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
@media (prefers-reduced-motion:reduce){.is{transition:none}.is:hover{transform:none}}

/* ---- galeri kontrolü: ok butonları + konum çizgisi ---- */
.isler-kontrol{display:flex;align-items:center;gap:14px;margin-top:18px}
.isler-ok{
  width:46px;height:46px;flex:none;border:1px solid var(--cizgi);background:transparent;
  color:var(--isik);display:flex;align-items:center;justify-content:center;cursor:pointer;
  transition:background .2s ease,border-color .2s ease,color .2s ease,opacity .2s ease;
}
.isler-ok:hover:not(:disabled){background:var(--amber);border-color:var(--amber);color:var(--gece)}
.isler-ok:disabled{opacity:.28;cursor:default}
.isler-ok:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
/* konum çizgisi: görünen oran kadar uzun, kaydırdıkça kayar */
.isler-cizgi{flex:1;height:2px;background:rgba(245,239,228,.12);overflow:hidden}
.isler-cizgi span{
  display:block;height:100%;background:var(--amber);
  /* Kaydırma sırasında yalnızca transform oynar; width geçişe alınmaz. */
  transition:transform .18s ease-out;
}

/* ============ HİZMET DETAY PANELİ ============ */
.dpanel{
  border:0;padding:0;background:transparent;max-width:none;max-height:none;
  width:100%;height:100%;color:var(--isik);overflow:visible;
}
.dpanel::backdrop{background:rgba(8,7,6,.82);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.dpanel-ic{
  position:relative;background:var(--gece-2);border:1px solid var(--cizgi);
  width:min(100%,1040px);max-height:100%;margin:auto;overflow-y:auto;
  padding:26px var(--kenar) 30px;
}
.dpanel-kapat{
  position:sticky;top:0;margin-left:auto;display:flex;align-items:center;justify-content:center;
  width:44px;height:44px;background:var(--gece);border:1px solid var(--cizgi);
  color:var(--isik);cursor:pointer;z-index:3;
  transition:background .2s ease,color .2s ease,border-color .2s ease;
}
.dpanel-kapat:hover{background:var(--amber);color:var(--gece);border-color:var(--amber)}
.dpanel-kapat:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
.dpanel-govde{display:grid;gap:26px;margin-top:-30px}
.dpanel h2{font-size:clamp(26px,6vw,40px);margin:12px 0 14px}
.dpanel-metin{color:var(--kul);font-size:15.5px;max-width:56ch}
.dpanel-liste{list-style:none;display:grid;gap:9px;margin:20px 0 24px;max-width:56ch}
.dpanel-liste li{position:relative;padding-left:22px;font-size:14.5px;color:var(--isik)}
.dpanel-liste li::before{
  content:"";position:absolute;left:0;top:.62em;width:9px;height:1.5px;background:var(--amber);
}
.dpanel-cta{display:flex;flex-wrap:wrap;gap:10px}
.btn-wa{background:var(--yesil);color:#fff}
.btn-wa:hover{transform:translateY(-2px);background:#4A8F68}
.dpanel-bos{color:var(--kul-koyu);font-size:14px;border:1px dashed var(--cizgi);padding:22px;text-align:center}
/* kareler ızgarası */
.dpanel-kareler{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.dkare{
  border:0;padding:0;background:var(--gece-3);cursor:zoom-in;overflow:hidden;
  aspect-ratio:4/3;display:block;
}
.dkare img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.dkare:hover img{transform:scale(1.06)}
.dkare:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
@media (prefers-reduced-motion:reduce){.dkare img{transition:none}.dkare:hover img{transform:none}}
@media (min-width:860px){
  .dpanel-ic{padding:30px 40px 40px}
  .dpanel-govde{grid-template-columns:1fr 1.05fr;gap:44px;align-items:start}
  .dpanel-kareler{grid-template-columns:repeat(2,1fr)}
}

/* ============ ARAMA SEÇİMİ ============
   Mobilde alttan kayan sayfa (başparmak erişimi), masaüstünde ortada kutu. */
.arasec{
  border:0;padding:0;background:transparent;max-width:none;max-height:none;
  width:100%;height:100%;color:var(--isik);
}
.arasec::backdrop{background:rgba(8,7,6,.8);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
.arasec-ic{
  position:absolute;left:0;right:0;bottom:0;
  background:var(--gece-2);border-top:1px solid rgba(232,163,77,.32);
  padding:26px var(--kenar) calc(24px + env(safe-area-inset-bottom));
  box-shadow:0 -18px 44px rgba(0,0,0,.6);
  transform:translateY(100%);
  transition:transform .34s cubic-bezier(.2,.8,.3,1);
}
.arasec[open] .arasec-ic{transform:none}
/* Üst kayıt: bölüm başlıklarındaki amber işaretin aynısı */
.arasec-ic::before{
  content:"";position:absolute;left:0;right:0;top:-1px;height:2px;
  background:linear-gradient(90deg,var(--amber) 0 54px,rgba(232,163,77,.32) 54px 100%);
}
.arasec-kapat{
  position:absolute;top:16px;right:var(--kenar);
  width:40px;height:40px;display:flex;align-items:center;justify-content:center;
  border:1px solid var(--cizgi);color:var(--kul);
  transition:background .2s ease,color .2s ease,border-color .2s ease;
}
.arasec-kapat:hover{background:var(--amber);color:var(--gece);border-color:var(--amber)}
.arasec-kapat:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
.arasec-eyebrow{
  font-family:var(--baslik);font-weight:700;font-size:22px;
  letter-spacing:-.02em;margin-bottom:6px;padding-right:52px;
}
.arasec-not{color:var(--kul);font-size:14px;margin-bottom:18px;max-width:38ch}
.arasec-kisi{
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
  border:1px solid var(--cizgi);padding:15px 18px;margin-bottom:10px;min-height:64px;
  transition:background .2s ease,border-color .2s ease;
}
.arasec-kisi:hover{background:rgba(232,163,77,.08);border-color:rgba(232,163,77,.5)}
.arasec-kisi:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
.ak-ad{font-family:var(--baslik);font-weight:500;font-size:15px;color:var(--kul)}
.ak-no{font-family:var(--baslik);font-weight:700;font-size:20px;color:var(--isik);letter-spacing:-.01em}
.arasec-wa{
  display:flex;align-items:center;justify-content:center;gap:9px;
  margin-top:14px;min-height:48px;color:var(--kul);font-size:14.5px;
  border-top:1px solid var(--cizgi);padding-top:16px;
  transition:color .2s ease;
}
.arasec-wa:hover{color:var(--isik)}
.arasec-wa:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
@media (prefers-reduced-motion:reduce){
  .arasec-ic{transition:none;transform:none}
}
@media (min-width:600px){
  /* Masaüstü: ortada kutu, alttan kayma yerine yerinde belirme */
  .arasec-ic{
    position:relative;inset:auto;margin:auto;top:50%;transform:translateY(-46%);
    width:min(420px,calc(100vw - 40px));
    border:1px solid rgba(232,163,77,.32);
    padding:30px 30px 26px;box-shadow:0 24px 60px rgba(0,0,0,.6);
  }
  .arasec[open] .arasec-ic{transform:translateY(-50%)}
  .arasec-kapat{right:16px}
  @media (prefers-reduced-motion:reduce){
    .arasec-ic,.arasec[open] .arasec-ic{transform:translateY(-50%)}
  }
}

/* ============ BÜYÜTEÇ (lightbox) ============ */
.buyut{
  border:0;padding:0;background:transparent;max-width:none;max-height:none;
  width:100%;height:100%;color:var(--isik);
  display:none;
}
.buyut[open]{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;
  padding:14px;place-items:center}
.buyut::backdrop{background:rgba(6,5,4,.94)}
.buyut-cerceve{grid-column:2;display:flex;flex-direction:column;align-items:center;gap:14px;
  max-width:100%;max-height:100%;margin:0}
.buyut-cerceve img{
  max-width:100%;max-height:78vh;width:auto;height:auto;object-fit:contain;
  border:1px solid rgba(245,239,228,.14);
}
.buyut-cerceve figcaption{font-size:14px;color:var(--kul);text-align:center;max-width:60ch}
.buyut-ok,.buyut-kapat{
  width:48px;height:48px;flex:none;border:1px solid var(--cizgi);background:rgba(18,16,14,.7);
  color:var(--isik);display:flex;align-items:center;justify-content:center;cursor:pointer;
  transition:background .2s ease,border-color .2s ease,color .2s ease;
}
.buyut-ok:hover,.buyut-kapat:hover{background:var(--amber);border-color:var(--amber);color:var(--gece)}
.buyut-ok:focus-visible,.buyut-kapat:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
.buyut-geri{grid-column:1}
.buyut-ileri{grid-column:3}
.buyut-kapat{position:fixed;top:14px;right:14px;z-index:4}
.buyut-sayac{
  position:fixed;left:0;right:0;bottom:16px;text-align:center;
  font-family:var(--baslik);font-weight:500;font-size:13px;letter-spacing:.14em;color:var(--kul);
}
@media (max-width:640px){
  /* mobilde oklar fotoğrafın altına iner — yanda yer yok */
  .buyut[open]{grid-template-columns:1fr;grid-template-rows:1fr auto}
  .buyut-cerceve{grid-column:1;grid-row:1}
  .buyut-geri,.buyut-ileri{grid-column:1;grid-row:2}
  .buyut-geri{justify-self:start}
  .buyut-ileri{justify-self:end}
  .buyut-cerceve img{max-height:66vh}
  .buyut-sayac{bottom:78px}
}

/* ============ Nasıl ilerliyor — dört adım ============
   Numaralar burada süsleme değil, bölüm gerçekten sıralı bir akış.
   Kutu/kart yok: üstteki ince çizgi ve üzerindeki nokta zaman çizgisi
   izlenimi veriyor, dört eşit kart ızgarasına düşmüyor. */
.nasil{background:transparent;border-top:1px solid var(--cizgi)}
.adimlar{list-style:none;display:grid;gap:30px;margin:0;padding:0}
.adim{position:relative;padding-top:22px;border-top:1px solid var(--cizgi)}
.adim::before{
  content:"";position:absolute;top:-3px;left:0;width:5px;height:5px;
  background:var(--amber);border-radius:999px;
}
.adim-no{
  font-family:var(--baslik);font-weight:700;font-size:13px;letter-spacing:.14em;
  color:var(--amber);display:block;margin-bottom:10px;font-variant-numeric:tabular-nums;
}
.adim h3{font-size:19px;margin:0 0 8px}
.adim p{color:var(--kul);font-size:15px;margin:0;max-width:46ch;text-wrap:pretty}
@media(min-width:760px){
  .adimlar{grid-template-columns:repeat(4,1fr);gap:24px}
  .adim p{font-size:14.5px}
}

/* ============ Sosyal — takip etmesi kolay olsun ============
   Altbilgideki 18px'lik ikonlar kimseyi takibe götürmüyordu. Marka rengi
   yalnızca zeminde ve ikonda; yazı koyu zeminde kalıyor, kontrast bozulmuyor. */
.sosyal{background:rgba(245,239,228,.03);border-top:1px solid var(--cizgi)}
.sos-liste{display:grid;gap:14px;max-width:820px}
.sos{
  display:flex;align-items:center;gap:18px;padding:22px 24px;
  border:1px solid var(--cizgi);background:var(--gece);color:var(--isik);
  position:relative;
  transition:transform .28s cubic-bezier(.2,.7,.3,1),border-color .28s ease,background .38s ease;
}
/* Marka rengi varsayılan durumda uygulanır: dokunmatikte hover yoktur.
   Grafik öğe kontrast eşiği 3:1, ikisi de koyu zeminde 7'nin üstünde. */
.sos-ikon{width:34px;height:34px;flex:none;transition:transform .28s ease}
.sos-ikon svg{width:100%;height:100%;display:block}
.sos-yazi{flex:1;min-width:0}
.sos-yazi b{display:block;font-family:var(--baslik);font-weight:700;font-size:19px}
.sos-yazi small{display:block;font-size:13.5px;color:var(--kul);margin-top:3px}
.sos-ok{width:19px;height:19px;flex:none;color:var(--kul-koyu);transition:transform .28s ease,color .28s ease}
.sos-ok svg{width:100%;height:100%;display:block}
.sos:hover{transform:translateY(-3px)}
.sos:hover .sos-ikon{transform:scale(1.08)}
.sos:hover .sos-ok{transform:translate(3px,-3px);color:var(--isik)}
.sos:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
.sos-ig:hover{
  border-color:#E1306C;
  background:linear-gradient(118deg,rgba(249,206,52,.13),rgba(238,42,123,.17) 52%,rgba(98,40,215,.19));
}
.sos-ig .sos-ikon{color:#F0619B}
.sos-fb .sos-ikon{color:#79B0FC}
.sos-fb:hover{border-color:#4293FB;background:rgba(24,119,242,.14)}
@media (min-width:700px){.sos-liste{grid-template-columns:1fr 1fr}}
@media (prefers-reduced-motion:reduce){
  .sos,.sos-ikon,.sos-ok{transition:none}
  .sos:hover{transform:none}
  .sos:hover .sos-ikon,.sos:hover .sos-ok{transform:none}
}

/* ============ Yorumlar ============ */
.yorumlar{background:rgba(245,239,228,.03);border-top:1px solid var(--cizgi)}
.yorum-liste{display:grid;gap:14px}
.yorum{
  background:var(--gece);border:1px solid var(--cizgi);border-radius:var(--r);padding:24px;
}
.yorum .yildiz{color:var(--amber);letter-spacing:2px;font-size:14px}
.yorum blockquote{margin:12px 0 16px;font-size:16px;line-height:1.6;color:var(--isik)}
.yorum cite{font-style:normal;font-size:13px;color:var(--kul);display:flex;align-items:center;gap:9px}
.yorum cite b{color:var(--isik);font-weight:600}

/* ============ SSS ============ */
.sss{background:transparent}
.sss-liste{display:grid;gap:0;max-width:760px}
.sss-madde{border-bottom:1px solid var(--cizgi)}
.sss-madde:first-child{border-top:1px solid var(--cizgi)}
.sss-madde summary{
  list-style:none;cursor:pointer;padding:20px 0;
  display:flex;align-items:center;gap:16px;
  font-family:var(--baslik);font-weight:500;font-size:16.5px;
}
.sss-madde summary::-webkit-details-marker{display:none}
.sss-arti{position:relative;width:16px;height:16px;flex:none;margin-left:auto;transition:transform .3s ease}
.sss-arti::before,.sss-arti::after{content:"";position:absolute;background:var(--amber)}
.sss-arti::before{left:0;right:0;top:7px;height:2px}
.sss-arti::after{top:0;bottom:0;left:7px;width:2px}
.sss-madde[open] .sss-arti{transform:rotate(45deg)}
.sss-madde > p{padding:0 0 22px;color:var(--kul);font-size:15px;max-width:62ch}

/* ============ İletişim / kapanış ============ */
.iletisim{
  background:var(--gece-2);border-top:1px solid var(--cizgi);
  position:relative;overflow:hidden;text-align:center;
}
.iletisim::before{
  content:"";position:absolute;bottom:-30%;left:50%;transform:translateX(-50%);
  width:120%;height:70%;background:radial-gradient(ellipse,rgba(232,163,77,.16),transparent 60%);pointer-events:none;
}
/* İletişim ortalanmış bölüm: başlık kaydı da ortadan başlar. */
/* Yol tarifi kendi satırında durur; adres satırının içine alınırsa
   dar ekranda üç satıra bölünür. */
.ib-yol{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  margin-top:8px;padding:11px 18px;min-height:44px;
  color:var(--amber);border:1px solid rgba(232,163,77,.42);
  font-family:var(--baslik);font-weight:500;font-size:14.5px;
  transition:background .2s ease,border-color .2s ease;
}
.ib-yol svg{flex:none}
.ib-yol:hover{background:rgba(232,163,77,.1);border-color:var(--amber)}
.iletisim .bolum-basli{margin-left:auto;margin-right:auto;text-align:center;max-width:640px}
.iletisim .bolum-basli::before{
  background:linear-gradient(90deg,var(--cizgi) 0 calc(50% - 27px),var(--amber) calc(50% - 27px) calc(50% + 27px),var(--cizgi) calc(50% + 27px) 100%);
}
.iletisim .bolum-basli::after{left:50%;transform:translateX(-50%)}
.iletisim .bolum-basli .isik{left:50%;transform:translateX(-50%)}
.iletisim h2{font-size:clamp(30px,8vw,58px);margin:0 0 16px}
.iletisim p{color:var(--kul);max-width:44ch;margin:0 auto 6px}
.iletisim-butonlar{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:22px}
.eposta{margin-top:20px;font-size:14px;color:var(--kul)}
/* Metin içi bağlantıda alt çizgi şart: amber/kül kontrastı 1.47,
   eşik 3.0. Renk tek başına ayırt edici değil. */
.eposta a{color:var(--amber);border-bottom:1px solid rgba(232,163,77,.55)}
.eposta a:hover{border-bottom-color:var(--amber)}

/* ============ Alt bilgi ============ */
.altbilgi{background:rgba(9,8,7,.5);padding:40px 0 30px}
.alt-ust{display:flex;flex-direction:column;gap:26px;padding-bottom:28px;border-bottom:1px solid var(--cizgi)}
.alt-marka .logo{font-size:21px}
.alt-slogan{margin-top:14px;color:var(--kul);font-size:14.5px;max-width:34ch;line-height:1.6}
.alt-sosyal{display:flex;gap:10px;margin-top:16px}
.alt-sosyal a{
  width:42px;height:42px;border-radius:0;border:1px solid var(--cizgi);
  display:flex;align-items:center;justify-content:center;color:var(--kul);
  transition:background .2s ease,color .2s ease,border-color .2s ease,transform .2s ease;
}
.alt-sosyal a:hover{background:var(--amber);color:var(--gece);border-color:var(--amber);transform:translateY(-3px)}
/* h4 değil h3: h2'den h4'e atlamak başlık sırasını bozar. */
.alt-kol h3{font-family:var(--baslik);font-weight:500;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--amber);margin-bottom:14px}
.alt-kol ul{list-style:none;display:grid;gap:2px}
/* 14 hizmet tek sütunda kule oluyordu: iki sütun, sırayı bozmadan yukarıdan
   aşağı doldurur. columns yerine grid — sütun sayısı ekrana göre net kalsın. */
.alt-hizmet{grid-template-columns:1fr 1fr;column-gap:26px}
/* WCAG 2.2 hedef boyutu: inline-flex + min-height ile tıklanabilir alan
   büyür, görsel boyut aynı kalır. */
.alt-kol a{
  color:var(--kul);font-size:14.5px;transition:color .2s ease;
  display:inline-flex;align-items:center;min-height:32px;
}
.alt-kol a:hover{color:var(--isik)}
.alt-alt{
  display:flex;flex-direction:column;gap:8px;padding-top:22px;
  font-size:12.5px;color:var(--kul-koyu);
}

/* ============ AKO — sağ alttaki karşılayıcı ============
   Yuvarlak bir pencere: kasa amber, cam koyu, kayıtlar bölmeleri ayırıyor,
   gözler camın arkasındaki ışık. Mobilde alt CTA çubuğunun ÜSTÜNDE durur. */
/* Balon ve menü akış dışında, düğmeye göre mutlak konumlu:
   akış içinde kalırlarsa kapalı menü balonu yukarı iter. */
.ako{
  position:fixed;right:var(--kenar);z-index:70;
  bottom:calc(80px + env(safe-area-inset-bottom));
  width:60px;height:60px;
  opacity:0;transform:translateY(14px) scale(.9);
  transition:opacity .45s ease,transform .45s cubic-bezier(.2,.8,.3,1);
}
.ako.acildi{opacity:1;transform:none}
@media (min-width:960px){.ako{bottom:28px}}

.ako-dugme{
  width:60px;height:60px;border-radius:999px;padding:0;
  background:var(--gece-2);
  box-shadow:0 10px 28px rgba(0,0,0,.55),0 0 0 1px rgba(232,163,77,.18),
             0 0 22px -4px rgba(232,163,77,.35);
  display:flex;align-items:center;justify-content:center;
  transition:transform .24s cubic-bezier(.2,.8,.3,1),box-shadow .24s ease;
}
.ako-dugme:hover{
  transform:scale(1.06);
  box-shadow:0 14px 34px rgba(0,0,0,.6),0 0 0 1px rgba(232,163,77,.4),
             0 0 30px -2px rgba(232,163,77,.55);
}
.ako-dugme:focus-visible{outline:2px solid var(--amber);outline-offset:4px}
.ako-yuz{width:100%;height:100%;display:block}
.ako-cam{fill:url(#akoIsik)}
.ako-kasa{fill:none;stroke:var(--amber);stroke-width:2.4}
/* kanat: gerçek doğramada kasanın içindeki ikinci çerçeve */
.ako-kanat{fill:none;stroke:rgba(232,163,77,.26);stroke-width:1}
.ako-kayit{stroke:rgba(245,239,228,.11);stroke-width:1.5}
.ako-goz{fill:var(--amber-2)}
/* Gözler tek grup: imleci izlerken kayar, kırparken dikeyde ezilir.
   transform-box:view-box şart, yoksa dönüşüm merkezi kayar. */
.ako-gozler{
  transform-box:view-box;transform-origin:32px 26px;
  transform:translate(var(--gx,0),var(--gy,0));
  transition:transform .09s linear;
  filter:drop-shadow(0 0 5px rgba(242,200,136,.55));
}
.ako-gozler.kirp{transform:translate(var(--gx,0),var(--gy,0)) scaleY(.12)}
/* menü açıkken gülümser gibi kısılır */
.ako.menu-acik .ako-gozler{transform:translate(var(--gx,0),var(--gy,0)) scaleY(.55)}

/* selamlama balonu */
/* Balon Ako ile aynı malzemeden: koyu cam, amber kasa, arkadan sızan ışık.
   Üstteki amber kayıt bölüm başlıklarındaki işaretin aynısı — balon sayfaya
   yapıştırılmış bir bildirim değil, aynı dilin parçası. */
.ako-balon{
  position:absolute;right:0;bottom:calc(100% + 15px);width:255px;
  background:var(--gece-2);color:var(--isik);padding:16px 36px 16px 17px;
  font-size:14px;line-height:1.45;
  border:1px solid rgba(232,163,77,.32);
  box-shadow:0 16px 36px rgba(0,0,0,.6),0 0 26px -6px rgba(232,163,77,.4);
  opacity:0;transform:translateY(8px) scale(.97);pointer-events:none;
  transition:opacity .32s ease,transform .32s cubic-bezier(.2,.8,.3,1);
}
.ako-balon.acik{opacity:1;transform:none;pointer-events:auto}
.ako-balon b{font-family:var(--baslik);font-weight:500;color:var(--amber-2)}
.ako-balon::before{ /* üst kayıt: solda amber, sağa doğru sönüyor */
  content:"";position:absolute;left:-1px;right:-1px;top:-1px;height:2px;
  background:linear-gradient(90deg,var(--amber) 0 46px,rgba(232,163,77,.32) 46px 100%);
}
/* Kuyruk kasanın devamı ve butonun tam merkezine bakar:
   .ako 60px, balon sağa hizalı -> merkez sağdan 30px, kare 12px -> right:24px */
.ako-balon::after{
  content:"";position:absolute;right:24px;bottom:-7px;width:12px;height:12px;
  background:var(--gece-2);transform:rotate(45deg);
  border-right:1px solid rgba(232,163,77,.32);
  border-bottom:1px solid rgba(232,163,77,.32);
}
.ako-balon-x{
  position:absolute;top:7px;right:7px;width:24px;height:24px;
  display:flex;align-items:center;justify-content:center;color:var(--kul);
  transition:color .2s ease;
}
.ako-balon-x:hover{color:var(--isik)}
.ako-balon-x:focus-visible{outline:2px solid var(--amber);outline-offset:1px}

/* menü */
.ako-menu{
  position:absolute;right:0;bottom:calc(100% + 14px);
  width:min(300px,calc(100vw - var(--kenar) * 2));
  background:var(--gece-2);border:1px solid var(--cizgi);
  box-shadow:0 18px 44px rgba(0,0,0,.6);padding:8px;
  opacity:0;transform:translateY(10px) scale(.97);pointer-events:none;
  transform-origin:100% 100%;
  transition:opacity .24s ease,transform .24s cubic-bezier(.2,.8,.3,1);
}
.ako-menu.acik{opacity:1;transform:none;pointer-events:auto}
.ako-menu-basli{
  font-family:var(--baslik);font-weight:700;font-size:13px;color:var(--kul);
  padding:10px 12px 8px;margin:0;
}
.ako-menu a{
  display:flex;align-items:center;gap:12px;padding:11px 12px;min-height:52px;
  transition:background .18s ease;
}
.ako-menu a:hover{background:rgba(245,239,228,.07)}
.ako-menu a:focus-visible{outline:2px solid var(--amber);outline-offset:-2px}
.ako-menu a svg{width:19px;height:19px;flex:none;color:var(--amber)}
.ako-menu a span{display:flex;flex-direction:column;line-height:1.3;min-width:0}
.ako-menu a b{font-family:var(--baslik);font-weight:500;font-size:14.5px;color:var(--isik)}
.ako-menu a small{font-size:12px;color:var(--kul);margin-top:2px}

@media (prefers-reduced-motion:reduce){
  .ako,.ako-dugme,.ako-balon,.ako-menu,.ako-gozler{transition:none}
  .ako-dugme:hover{transform:none}
}

/* ============ Mobil sabit alt CTA çubuğu ============ */
.mobil-cta{
  position:fixed;left:0;right:0;bottom:0;z-index:60;display:grid;grid-template-columns:1fr 1fr;gap:10px;
  padding:10px var(--kenar) calc(10px + env(safe-area-inset-bottom));
  background:rgba(18,16,14,.94);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border-top:1px solid var(--cizgi);
}
.mobil-cta a{
  display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;border-radius:0;
  font-family:var(--baslik);font-weight:500;font-size:15px;
}
.mobil-cta .m-ara{background:var(--amber);color:var(--gece)}
.mobil-cta .m-wa{background:var(--yesil);color:#fff}
body{padding-bottom:72px}

/* ============ Kaydırınca beliren (reveal) ============ */
html.js .gel{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease;transition-delay:var(--gec,0s)}
html.js .gel.gorunur{opacity:1;transform:none}

/* ===================================================================
   MASAÜSTÜ — mobil temeli büyüt (min-width ile)
   =================================================================== */
@media (min-width:720px){
  :root{--kenar:40px}
  .hizmet-liste{grid-template-columns:1fr 1fr}
  .hkart.genis{grid-column:1/-1;min-height:320px}
  .yorum-liste{grid-template-columns:1fr 1fr 1fr}
  .is{flex-basis:44%}
  .alt-ust{flex-direction:row;justify-content:space-between}
  .alt-linkler{display:flex;gap:64px}
  .alt-alt{flex-direction:row;justify-content:space-between;align-items:center}
  .hero-alt{flex-direction:row;align-items:flex-end;justify-content:space-between;gap:40px}
  .hero-metin{font-size:17px}
}
@media (min-width:960px){
  :root{--kenar:56px}
  body{padding-bottom:0}
  .mobil-cta{display:none}
  html{scroll-padding-bottom:0}   /* alt çubuk gizli, ek boşluğa gerek yok */
  .ust-nav{display:flex;align-items:center;gap:6px;margin:0 auto}
  .ust-nav a{
    position:relative;font-size:14.5px;font-weight:500;color:var(--isik);opacity:.8;padding:8px 12px;
    transition:opacity .2s ease,color .2s ease;
  }
  .ust-nav a::after{content:"";position:absolute;left:12px;right:12px;bottom:3px;height:1.5px;background:var(--amber);transform:scaleX(0);transform-origin:100%;transition:transform .3s ease}
  .ust-nav a:hover{opacity:1;color:var(--amber)}
  .ust-nav a:hover::after,.ust-nav a.aktif::after{transform:scaleX(1);transform-origin:0}
  .ust-nav a.aktif{opacity:1;color:var(--amber)}
  .bolum{padding:110px 0}
  /* 6'lık grid: genis=3 birim, normal=2 birim.
     14 kart = 2 genis (6) + 12 normal (24) = 30 birim = tam 5 satır.
     Kart sayısı değişirse toplam birim 6'nın katı olmalı, yoksa son satır
     yarım kalır. Genis kartı arttırmak/azaltmak bu dengeyi bozar. */
  .hizmet-liste{grid-template-columns:repeat(6,1fr)}
  .hkart{min-height:340px;grid-column:span 2}
  .hkart.genis{grid-column:span 3;min-height:380px}
  /* Alt sınır 72px değil 44px: alçak masaüstü ekranlarda (1366x768) yükseklik
     sınırı devreye girdiğinde clamp'in alt sınırı taşmayı geri getirmemeli. */
  .hero h1{font-size:clamp(44px,min(9vw,10.5svh),132px)}
  .hero{padding-bottom:50px}
  .hero-serit{gap:44px}
  .hero-stat b{font-size:32px}
  .is{flex-basis:31%}
}
@media (min-width:1200px){
  /* Sabit 140px, yüksekliği hiç dikkate almadığı için 1366x768 gibi geniş ama
     alçak laptop ekranlarında başlığın ilk satırını ekran dışına taşırıyordu.
     Yükseklik payı da sınıra girsin. */
  .hero h1{font-size:min(140px,10.5svh)}
}

@media (prefers-reduced-motion:reduce){
  .hero-foto img{transform:scale(1.03)}
  html.js .gel{opacity:1;transform:none;transition:none}
  .hkart-foto img,.hkart-ok,.btn,.ust-ara,.alt-sosyal a{transition:none}
}

/* ============ BELGE SAYFASI (KVKK vb.) ============ */
.belge{padding-bottom:0}
.belge-govde{padding:104px 0 72px}
.belge-govde .wrap{max-width:760px}
.belge-govde h1{font-size:clamp(30px,8vw,52px);margin:14px 0 18px}
.belge-govde h2{
  font-size:20px;margin:44px 0 12px;padding-top:22px;
  border-top:1px solid var(--cizgi);
}
.belge-govde p{color:var(--kul);margin-bottom:14px}
.belge-ozet{font-size:17px;color:var(--isik);max-width:58ch}
.belge-liste{list-style:none;display:grid;gap:10px;margin:0 0 18px}
.belge-liste li{
  color:var(--kul);font-size:15px;padding-left:20px;position:relative;
}
.belge-liste li::before{
  content:"";position:absolute;left:0;top:.72em;
  width:9px;height:1px;background:var(--amber);
}
.belge-liste b,.belge-govde p b{color:var(--isik)}
/* Madde başına oturan tek bağlantı: WCAG 2.2 satır içi istisnası bunu
   kapsamıyor, dokunma hedefi 24px'in üstüne çıkarılmalı. */
.belge-bag{
  display:inline-flex;align-items:center;min-height:30px;
  color:var(--isik);text-decoration:underline;
  text-underline-offset:3px;text-decoration-color:rgba(232,163,77,.5);
  transition:color .2s ease,text-decoration-color .2s ease;
}
.belge-bag:hover{color:var(--amber);text-decoration-color:var(--amber)}
.belge-liste small{display:block;color:var(--kul-koyu);font-size:13.5px;margin-top:-2px}

.belge-vurgu{
  border-left:2px solid var(--amber);padding:4px 0 4px 18px;
  color:var(--isik);font-size:15px;
}
.belge-not{font-size:14px;color:var(--kul-koyu)}

.belge-don{margin-top:12px}
@media (min-width:720px){
  .belge-govde{padding:132px 0 88px}
  .belge-govde h2{font-size:23px}
}
.alt-yasal{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.alt-yasal a{color:var(--kul);border-bottom:1px solid var(--cizgi);transition:color .2s ease,border-color .2s ease;
  display:inline-flex;align-items:center;min-height:26px}
.alt-yasal a:hover{color:var(--amber);border-color:var(--amber)}
.iletisim-kvkk{
  margin-top:22px;font-size:13px;color:var(--kul-koyu);
  max-width:52ch;margin-left:auto;margin-right:auto;
}
.iletisim-kvkk a{color:var(--kul);border-bottom:1px solid var(--cizgi)}
.iletisim-kvkk a:hover{color:var(--amber);border-color:var(--amber)}

/* ============ HAKKIMIZDA ============ */
.hakkimizda{background:rgba(245,239,228,.03);border-top:1px solid var(--cizgi)}
.hakkimizda-ic{display:grid;gap:34px}
.hakkimizda-metin{color:var(--kul);font-size:16px;max-width:52ch;margin-bottom:26px}
.hakkimizda-kutu{
  list-style:none;display:grid;gap:0;margin:0 0 28px;
  grid-template-columns:1fr;border-top:1px solid var(--cizgi);
}
.hakkimizda-kutu li{padding:16px 0;border-bottom:1px solid var(--cizgi)}
.hakkimizda-kutu li:last-child{border-bottom:0}
.hakkimizda-kutu b{
  display:block;font-family:var(--baslik);font-weight:700;font-size:17px;color:var(--amber);
  line-height:1.15;
}
.hakkimizda-kutu span{display:block;font-size:12.5px;color:var(--kul);margin-top:4px;line-height:1.35}
.hakkimizda-foto{position:relative;overflow:hidden;margin:0}
.hakkimizda-foto figcaption{
  margin-top:10px;font-size:12.5px;color:var(--kul-koyu);line-height:1.4;
}
.hakkimizda-foto img{width:100%;height:100%;object-fit:cover}
@media (min-width:860px){
  .hakkimizda-ic{grid-template-columns:1fr 1fr;gap:56px;align-items:center}
  .hakkimizda-kutu b{font-size:19px}
}

/* Fotoğrafı henüz gelmemiş hizmet: boş kutu değil, tasarlanmış ikon kartı.
   Fotoğraf gelince .hkart-ikon bloğu .hkart-foto ile değişir. */
.hkart:has(.hkart-ikon){min-height:348px}
.hkart-ikon{
  position:absolute;inset:0;z-index:-1;display:flex;
  align-items:center;justify-content:center;padding-bottom:120px;
  background:
    radial-gradient(120% 90% at 50% 18%,rgba(232,163,77,.12),transparent 62%),
    repeating-linear-gradient(135deg,transparent 0 16px,rgba(245,239,228,.022) 16px 32px),
    var(--gece-3);
}
.hkart-ikon::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 42%,rgba(18,16,14,.86) 82%);
}
.hkart-ikon svg{
  width:74px;height:74px;color:var(--amber);opacity:.72;
  transition:transform .35s cubic-bezier(.2,.7,.2,1),opacity .35s ease;
}
.hkart:hover .hkart-ikon svg,.hkart:focus-within .hkart-ikon svg{transform:scale(1.07);opacity:1}
@media (min-width:960px){.hkart-ikon svg{width:88px;height:88px}}
@media (prefers-reduced-motion:reduce){.hkart-ikon svg{transition:none}}

/* İki ortak, iki hat — hangi numaranın kime ait olduğu net olmalı */
.tel-ikili{
  display:grid;gap:12px;margin:26px auto 8px;max-width:520px;
  grid-template-columns:1fr;
}
.tel-kisi{
  display:flex;flex-direction:column;gap:2px;padding:14px 18px;
  border:1px solid var(--cizgi);background:rgba(245,239,228,.03);
  transition:border-color .2s ease,background .2s ease;
}
.tel-kisi:hover{border-color:var(--amber);background:rgba(232,163,77,.07)}
.tk-ad{font-size:12.5px;color:var(--kul);letter-spacing:.04em}
.tk-no{
  font-family:var(--baslik);font-weight:700;font-size:clamp(22px,6vw,30px);
  color:var(--isik);letter-spacing:-.01em;
}
.tel-kisi:hover .tk-no{color:var(--amber)}
.iletisim-bilgi{margin-top:28px;display:grid;gap:10px;justify-items:center}
/* .iletisim p'den gelen 44ch sınırı adresi masaüstünde gereksiz yere
   ikiye böler; adres satırı bu sınırın dışında. */
.iletisim .ib-satir{text-wrap:balance;max-width:none;
  display:flex;align-items:center;gap:9px;
  font-size:14.5px;color:var(--kul);margin:0;
}
.ib-satir svg{flex:none;color:var(--amber)}
@media (min-width:560px){.tel-ikili{grid-template-columns:1fr 1fr}}

/* Marka güveni: "hangi profili kullanıyorsunuz" en sık sorulan soru */
/* Profil markaları sayfanın ortasında dursun: üç logo bir güven şeridi,
   sola yaslandığında sağda kocaman boşluk kalıyordu. */
.marka-guven{
  margin-top:48px;padding-top:30px;border-top:1px solid var(--cizgi);text-align:center;
}
.mg-baslik{
  font-family:var(--baslik);font-weight:500;font-size:12px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--amber);margin-bottom:18px;
}
.mg-liste{
  list-style:none;display:flex;flex-wrap:wrap;gap:12px;margin:0 auto 20px;padding:0;
  align-items:center;justify-content:center;
}
.mg-liste li{display:flex}
.mg-liste img{
  width:clamp(150px,42vw,200px);height:auto;
  border:1px solid rgba(245,239,228,.14);
}
.mg-not{color:var(--kul);font-size:14.5px;max-width:62ch;margin:0 auto}
/* Dikey dükkân fotoğrafı (0.54 oran) masaüstünde 951px'e çıkıyordu; bölümü
   gereksiz uzatıyor. Kırpmak yerine küçültüyoruz — tabela da insanlar da kalsın. */
@media (min-width:860px){
  .hakkimizda-foto img{max-height:620px;width:auto;margin:0 auto}
  .hakkimizda-foto figcaption{text-align:center}
}

/* Hakkımızda alıntısı — bölümün duygusal çapası, iki kardeşin kendi sözü */
.hakkimizda-soz{
  margin:26px 0 28px;padding:0 0 0 20px;
  border-left:2px solid var(--amber);
}
.hakkimizda-soz p{
  font-family:var(--baslik);font-weight:500;
  font-size:clamp(17px,4.2vw,21px);line-height:1.4;
  color:var(--isik);letter-spacing:-.01em;margin:0 0 12px;
}
.hakkimizda-soz cite{
  font-style:normal;font-size:13px;color:var(--amber);
  letter-spacing:.08em;text-transform:uppercase;
}