/* 01 Rota Ağı — confined to the existing neighborhood section. */
#mahalle-rehberi.nk-r1-section {
  margin-top: 0;
  padding: 0 0 26px;
  border-top: 1px solid #deeee6;
  background: linear-gradient(180deg, #fff 0, #f2faf6 90px, #f2faf6 75%, #e4f3ee 100%);
  isolation: isolate;
}
#mahalle-rehberi.nk-r1-section .nk-r1-hero {
  position: relative;
  width: min(100% - 64px, 1400px);
  min-height: 618px;
  margin-inline: auto;
}
#mahalle-rehberi.nk-r1-section .nk-r1-copy {
  position: relative;
  z-index: 3;
  width: 37%;
  max-width: 470px;
  padding: 96px 0 100px;
}
#mahalle-rehberi.nk-r1-section .nk-neighborhood-eyebrow {
  margin-bottom: 23px;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: #2a7067;
  font-size: 12px;
  letter-spacing: .19em;
}
#mahalle-rehberi.nk-r1-section .nk-neighborhood-heading {
  margin: 0 0 23px;
  font-size: clamp(40px, 4.2vw, 62px);
  line-height: 1.06;
  letter-spacing: -.055em;
}
#mahalle-rehberi.nk-r1-section .nk-neighborhood-heading span { display: block; }
#mahalle-rehberi.nk-r1-section .nk-neighborhood-description {
  max-width: 365px;
  font-size: 18px;
  line-height: 1.7;
}
#mahalle-rehberi.nk-r1-section .nk-r1-discover {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 25px;
  min-height: 54px;
  max-width: 100%;
  margin-top: 29px;
  padding: 15px 22px;
  border: 1px solid #075157;
  border-radius: 7px;
  background: #075157;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.35;
  text-decoration: none;
  transition: background .16s ease;
}
#mahalle-rehberi.nk-r1-section .nk-r1-discover:hover { background: #073f45; }
#mahalle-rehberi.nk-r1-section .nk-r1-discover svg,
#mahalle-rehberi.nk-r1-section .nk-r1-foot a svg { width: 22px; height: 22px; flex: 0 0 22px; }
#mahalle-rehberi.nk-r1-section .nk-r1-scene { position: absolute; inset: 15px -16px 50px 36%; }
#mahalle-rehberi.nk-r1-section .nk-r1-routes {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  color: #a9cdc0;
  pointer-events: none;
}
#mahalle-rehberi.nk-r1-section .nk-r1-photo {
  position: absolute;
  z-index: 1;
  right: 0;
  bottom: -25px;
  width: 107%;
  max-width: none;
  height: auto;
  margin: 0;
  mix-blend-mode: multiply;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 22%, #000 97%, transparent), linear-gradient(180deg, transparent, #000 17%, #000 88%, transparent);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent, #000 22%, #000 97%, transparent), linear-gradient(180deg, transparent, #000 17%, #000 88%, transparent);
  mask-composite: intersect;
}
#mahalle-rehberi.nk-r1-section .nk-neighborhood-nav {
  position: absolute;
  z-index: 2;
  inset: 0;
  display: block;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
#mahalle-rehberi.nk-r1-section .nk-neighborhood-tab {
  position: absolute;
  display: inline-flex;
  flex-direction: row;
  gap: 9px;
  justify-content: flex-start;
  min-height: 47px;
  max-width: 210px;
  padding: 8px 13px 8px 9px;
  border: 1px solid transparent;
  border-radius: 28px;
  color: #174d4f;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.25;
  text-align: left;
  white-space: nowrap;
  background: rgb(242 250 246 / 86%);
  transition: background .16s ease, border-color .16s ease;
}
#mahalle-rehberi.nk-r1-section .nk-neighborhood-tab::before,
#mahalle-rehberi.nk-r1-section .nk-neighborhood-tab::after { display: none; }
#mahalle-rehberi.nk-r1-section .nk-r1-pin { width: 25px; height: 31px; flex: 0 0 25px; color: #075157; }
#mahalle-rehberi.nk-r1-section .nk-neighborhood-tab:hover,
#mahalle-rehberi.nk-r1-section .nk-neighborhood-tab[aria-selected="true"] { border-color: #abcfc0; background: #d7eee2; color: #073f45; }
#mahalle-rehberi.nk-r1-section .nk-neighborhood-tab:focus-visible { outline: 3px solid #075157; outline-offset: 4px; }
#mahalle-rehberi.nk-r1-section .nk-r1-sirinevler { left: 22%; top: 43%; }
#mahalle-rehberi.nk-r1-section .nk-r1-halkali-merkez { left: 53%; top: 24%; }
#mahalle-rehberi.nk-r1-section .nk-r1-gunesli { right: 0; top: 42%; }
#mahalle-rehberi.nk-r1-section .nk-r1-avcilar-merkez { left: 0; top: 23%; }
#mahalle-rehberi.nk-r1-section .nk-r1-kayabasi { left: 19%; top: 4%; }
#mahalle-rehberi.nk-r1-section .nk-r1-mehtercesme { right: 4%; top: 5%; }
#mahalle-rehberi.nk-r1-section .nk-r1-foot {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  width: min(100% - 64px, 1400px);
  margin: 0 auto;
  padding: 20px 0;
  border-top: 1px solid #cce2d8;
  color: #426d65;
  font-size: 13px;
  line-height: 1.5;
}
#mahalle-rehberi.nk-r1-section .nk-r1-location { display: inline-flex; align-items: center; gap: 9px; }
#mahalle-rehberi.nk-r1-section .nk-r1-location svg { width: 18px; height: 22px; flex: 0 0 18px; color: #075157; }
#mahalle-rehberi.nk-r1-section .nk-r1-foot a { display: inline-flex; align-items: center; gap: 14px; min-height: 44px; color: #075157; font-weight: 700; text-decoration: none; }
#mahalle-rehberi.nk-r1-section .nk-r1-foot a:hover { text-decoration: underline; text-underline-offset: 4px; }
#mahalle-rehberi.nk-r1-section .nk-r1-guide {
  width: min(100% - 64px, 1400px);
  margin: 0 auto;
  border-block: 1px solid #cce2d8;
  scroll-margin-top: 140px;
}
#mahalle-rehberi.nk-r1-section .nk-r1-guide > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-height: 62px;
  padding: 16px 0;
  color: #174d4f;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
  list-style: none;
  cursor: pointer;
}
#mahalle-rehberi.nk-r1-section .nk-r1-guide > summary::-webkit-details-marker { display: none; }
#mahalle-rehberi.nk-r1-section .nk-r1-guide > summary > span { display: flex; flex-wrap: wrap; gap: 5px 15px; }
#mahalle-rehberi.nk-r1-section .nk-r1-selected { color: #4e746c; font-size: 13px; font-weight: 400; }
#mahalle-rehberi.nk-r1-section .nk-r1-guide > summary > svg { width: 23px; height: 23px; flex: 0 0 23px; transition: transform .16s ease; }
#mahalle-rehberi.nk-r1-section .nk-r1-guide[open] > summary > svg { transform: rotate(180deg); }
#mahalle-rehberi.nk-r1-section .nk-r1-guide-body { padding: 0 0 30px; }
#mahalle-rehberi.nk-r1-section .nk-r1-guide .nk-neighborhood-photo { height: clamp(210px, 24vw, 330px); border-radius: 8px; }
#mahalle-rehberi.nk-r1-section .nk-r1-discover:focus-visible,
#mahalle-rehberi.nk-r1-section .nk-r1-foot a:focus-visible,
#mahalle-rehberi.nk-r1-section .nk-r1-guide > summary:focus-visible { outline: 3px solid #075157; outline-offset: 4px; }
@media (min-width: 1800px) {
  #mahalle-rehberi.nk-r1-section .nk-r1-photo { width: 103%; }
}
@media (min-width: 1000px) and (max-width: 1199px) {
  #mahalle-rehberi.nk-r1-section .nk-r1-hero { min-height: 590px; }
  #mahalle-rehberi.nk-r1-section .nk-r1-copy { width: 38%; padding-top: 100px; }
  #mahalle-rehberi.nk-r1-section .nk-neighborhood-heading { font-size: 43px; }
  #mahalle-rehberi.nk-r1-section .nk-neighborhood-description { max-width: 300px; font-size: 16px; }
  #mahalle-rehberi.nk-r1-section .nk-neighborhood-tab { gap: 5px; padding-inline: 7px; font-size: 14px; }
  #mahalle-rehberi.nk-r1-section .nk-r1-pin { width: 21px; height: 27px; flex-basis: 21px; }
  #mahalle-rehberi.nk-r1-section .nk-r1-halkali-merkez { left: 49%; }
  #mahalle-rehberi.nk-r1-section .nk-r1-sirinevler { left: 17%; }
}
@media (max-width: 999px) {
  #mahalle-rehberi.nk-r1-section .nk-r1-hero { min-height: 0; }
  #mahalle-rehberi.nk-r1-section .nk-r1-copy { width: 100%; max-width: 650px; padding: 45px 0 0; }
  #mahalle-rehberi.nk-r1-section .nk-neighborhood-eyebrow { margin-bottom: 18px; }
  #mahalle-rehberi.nk-r1-section .nk-neighborhood-heading { font-size: clamp(38px, 6.7vw, 56px); }
  #mahalle-rehberi.nk-r1-section .nk-neighborhood-description { max-width: 510px; }
  #mahalle-rehberi.nk-r1-section .nk-r1-discover { margin-top: 22px; }
  #mahalle-rehberi.nk-r1-section .nk-r1-scene { position: relative; inset: auto; min-height: 465px; margin-top: 12px; }
  #mahalle-rehberi.nk-r1-section .nk-r1-routes { opacity: .65; }
  #mahalle-rehberi.nk-r1-section .nk-neighborhood-nav { position: relative; inset: auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 12px; padding-top: 24px; }
  #mahalle-rehberi.nk-r1-section .nk-neighborhood-tab { position: static; min-width: 0; max-width: none; min-height: 48px; padding: 9px 10px; font-size: 15px; white-space: normal; }
  #mahalle-rehberi.nk-r1-section .nk-r1-photo { right: 0; bottom: 0; width: 100%; max-width: 780px; }
}
@media (max-width: 599px) {
  #mahalle-rehberi.nk-r1-section { padding-bottom: 19px; }
  #mahalle-rehberi.nk-r1-section .nk-r1-hero,
  #mahalle-rehberi.nk-r1-section .nk-r1-foot,
  #mahalle-rehberi.nk-r1-section .nk-r1-guide { width: calc(100% - 36px); }
  #mahalle-rehberi.nk-r1-section .nk-r1-copy { padding-top: 35px; }
  #mahalle-rehberi.nk-r1-section .nk-neighborhood-heading { margin-bottom: 18px; font-size: clamp(34px, 9.1vw, 49px); }
  #mahalle-rehberi.nk-r1-section .nk-neighborhood-description { font-size: 16px; line-height: 1.65; }
  #mahalle-rehberi.nk-r1-section .nk-r1-discover { gap: 25px; min-height: 52px; font-size: 15px; }
  #mahalle-rehberi.nk-r1-section .nk-r1-scene { min-height: 405px; margin-top: 10px; }
  #mahalle-rehberi.nk-r1-section .nk-r1-routes { display: none; }
  #mahalle-rehberi.nk-r1-section .nk-neighborhood-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 6px; padding-top: 18px; }
  #mahalle-rehberi.nk-r1-section .nk-neighborhood-tab { gap: 5px; min-height: 50px; padding: 8px 6px; font-size: 13px; }
  #mahalle-rehberi.nk-r1-section .nk-r1-pin { width: 20px; height: 26px; flex-basis: 20px; }
  #mahalle-rehberi.nk-r1-section .nk-r1-photo { right: 0; bottom: 0; width: 100%; }
  #mahalle-rehberi.nk-r1-section .nk-r1-foot { flex-direction: column; align-items: flex-start; gap: 2px; padding: 15px 0; }
  #mahalle-rehberi.nk-r1-section .nk-r1-guide > summary { min-height: 64px; font-size: 14px; }
  #mahalle-rehberi.nk-r1-section .nk-r1-selected { font-size: 12px; }
  #mahalle-rehberi.nk-r1-section .nk-r1-guide .nk-neighborhood-photo { height: 190px; }
}
@media (prefers-reduced-motion: reduce) {
  #mahalle-rehberi.nk-r1-section .nk-r1-discover,
  #mahalle-rehberi.nk-r1-section .nk-neighborhood-tab,
  #mahalle-rehberi.nk-r1-section .nk-r1-guide > summary > svg { transition: none; }
}
