/* Satoshi — self-hosted (Fontshare CDN bypass for performance + privacy + GDPR) */
@font-face {
  font-family: 'Satoshi';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/satoshi-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Satoshi';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/satoshi-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Satoshi';
  font-style: normal;
  font-weight: 600 700;
  font-display: swap;
  src: url('../fonts/satoshi-700.woff2') format('woff2');
}

/* Erişilebilirlik: ekran okuyucu için görünmez ama indexlenir — H1 görsel olarak intro-title rotasyonuyla gelir */
.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Map facade — statik OSM görseli + tıklayınca iframe (gerçek lazy) */
.map-facade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  overflow: hidden;
  background: #0a1018;
  display: block;
  border: 0;
}
.map-facade picture,
.map-facade .map-facade-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center;
  transition: transform .9s var(--ease-out-expo), filter .5s ease;
  will-change: transform;
}
.map-facade:hover .map-facade-img,
.map-facade:focus-visible .map-facade-img {
  transform: scale(1.04);
  filter: brightness(.95);
}
.map-facade-overlay {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: end center;
  padding-bottom: 28px;
  background: linear-gradient(180deg, transparent 55%, rgba(5,8,13,.55) 100%);
  transition: background .35s ease;
  pointer-events: none;
}
.map-facade:hover .map-facade-overlay,
.map-facade:focus-visible .map-facade-overlay {
  background: linear-gradient(180deg, rgba(5,8,13,.12) 0%, rgba(5,8,13,.72) 100%);
}
.map-facade-cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  border-radius: 999px;
  background: rgba(10,14,20,.85);
  border: 1px solid rgba(200,169,119,.4);
  color: #fff;
  font-family: var(--font-display);
  font-size: .76rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 8px 24px -8px rgba(0,0,0,.6);
  transition: transform .3s var(--ease-out-expo), border-color .3s ease, color .3s ease, background .3s ease;
  pointer-events: none;
}
.map-facade-cta svg { opacity: .85; }
.map-facade:hover .map-facade-cta,
.map-facade:focus-visible .map-facade-cta {
  transform: translateY(-2px);
  border-color: var(--color-gold);
  color: var(--color-gold);
  background: rgba(10,14,20,.95);
}
.map-facade:focus-visible {
  outline: 2px solid var(--color-gold);
  outline-offset: -4px;
}
.map-facade.is-loaded {
  cursor: default;
}
.map-facade.is-loaded picture,
.map-facade.is-loaded .map-facade-overlay {
  display: none;
}
.map-facade iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
  filter: saturate(.92) brightness(.98) contrast(1.02);
  z-index: 2;
}