/* Silver 01 map direction. Loaded after the legacy map, v3 and palette D layers. */
html.draft-v3 .hero {
  position: relative;
  isolation: isolate;
  background: #171c21;
}
html.draft-v3 .hero::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: auto 0 -1px;
  height: clamp(100px, 11vw, 140px);
  background: linear-gradient(180deg, rgba(222,228,230,0), #dee4e6 96%);
  pointer-events: none;
}
html.draft-v3 .hero-in { position: relative; z-index: 2; }

html.draft-v3 .geo.geo-bleed {
  overflow: visible;
  padding: 0 !important;
  color: #29363c;
  background: #dee4e6 !important;
  --text-primary: #29363c;
  --text-secondary: #57666d;
  --brand-blue: #637e8b;
  --hairline: rgba(41,54,60,.16);
  --hairline-strong: rgba(41,54,60,.28);
}
html.draft-v3 .geo-stage {
  min-height: 0;
  height: auto;
  overflow: visible;
  background: #dee4e6;
}
html.draft-v3 .geo-stage .geo-fore {
  display: block;
  min-height: 0;
  padding: 54px 0 58px;
  color: #29363c;
  pointer-events: auto;
}
html.draft-v3 .geo-stage .geo-fore > * { pointer-events: auto; }
html.draft-v3 .geo-stage .geo-fore .sec-head { max-width: 760px; margin-bottom: 22px; }
html.draft-v3 .geo-fore .sec-head h2,
html.draft-v3 .geo-fore .lede {
  color: #29363c;
  text-shadow: none;
}
html.draft-v3 .geo-fore .kicker { color: #5b7783; }
html.draft-v3 .geo-fore .lede { max-width: 58ch; }
html.draft-v3 .geo-codes { gap: 8px; margin: 0 0 20px; }
html.draft-v3 .geo-code,
html.draft-v3 .geo-nav {
  color: #40525b;
  border-color: rgba(41,54,60,.22);
  background: linear-gradient(180deg,#f7f9f9,#e2e8ea);
  box-shadow: inset 0 1px 0 #fff, 0 5px 12px rgba(35,48,54,.08);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html.draft-v3 .geo-code:hover,
html.draft-v3 .geo-nav:hover { color: #29363c; border-color: #7f9ca9; }
html.draft-v3 .geo-code[aria-selected="true"] {
  color: #f4f7f7;
  border-color: #34454e;
  background: linear-gradient(180deg,#4a5860,#29363c);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 7px 16px rgba(35,48,54,.16);
}

/* The restructured shell owns the map/photo layer and the matching airport detail. */
html.draft-v3 .silver-map-shell {
  display: grid;
  grid-template-columns: minmax(0,1fr) 280px;
  align-items: stretch;
  width: 100%;
  border: 1px solid rgba(82,101,111,.23);
  border-radius: 18px;
  overflow: visible;
  background: linear-gradient(145deg,#d5dfe3,#c2d1d9);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.82), 0 22px 48px rgba(35,48,54,.13), 0 3px 9px rgba(35,48,54,.06);
}
html.draft-v3 #map.map,
html.draft-v3 .silver-map-shell > #map {
  position: relative;
  inset: auto;
  z-index: 1;
  width: 100%;
  height: auto;
  min-width: 0;
  aspect-ratio: 1000 / 620;
  margin: 0;
  overflow: visible;
  border: 0;
  border-radius: 18px 0 0 18px;
  background: linear-gradient(150deg,#c9d6dc,#b9c9d1 72%,#c8d5da);
  isolation: isolate;
}
html.draft-v3 #map .geo-spot { display: none; }
html.draft-v3 .geo-stage #map::after { content:none; display:none; }
html.draft-v3 #map .silver-geography {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  z-index: 1;
  overflow: hidden;
  border-radius: inherit;
}
html.draft-v3 .silver-geography .map-country {
  fill: rgba(221,227,229,.86);
  stroke: #82959e;
  stroke-width: .8;
  vector-effect: non-scaling-stroke;
}
html.draft-v3 .silver-geography .map-country-kz {
  fill: #edf1f2;
  stroke: #6f858f;
  stroke-width: 1.35;
  vector-effect: non-scaling-stroke;
}
html.draft-v3 .silver-geography .map-coordinate-grid path {
  fill: none;
  stroke: #708894;
  stroke-width: .6;
  opacity: .23;
  vector-effect: non-scaling-stroke;
}
html.draft-v3 .silver-geography .map-coordinate-grid text {
  fill: #52666f;
  opacity: .48;
  font: 10px/1 var(--ff-mono,ui-monospace,monospace);
  letter-spacing: .07em;
}
html.draft-v3 .silver-geography .map-country-label {
  fill: #435760;
  opacity: .53;
  font: 12px/1 var(--ff-body,"PJ Commissioner",sans-serif);
  letter-spacing: .09em;
  text-anchor: middle;
}
html.draft-v3 .silver-geography .map-country-label[data-country="kazakhstan"] {
  fill: #344b56;
  opacity: .75;
  font-size: 19px;
  font-weight: 600;
}
html.draft-v3 .map-photo-layer {
  position: absolute;
  inset: 0;
  z-index: 4;
  overflow: visible;
  pointer-events: none;
}
html.draft-v3 .map-photo-leaders {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}
html.draft-v3 .map-photo-leader {
  fill: none;
  stroke: rgba(73,107,124,.68);
  stroke-width: 1;
  stroke-dasharray: none;
  vector-effect: non-scaling-stroke;
}
html.draft-v3 .geo-stage .pin { opacity: 1; }
html.draft-v3 .geo-stage .pin circle:not(.halo) {
  fill: #496b7c;
  stroke: #f4f7f7;
  stroke-width: 2.2;
  vector-effect: non-scaling-stroke;
}
html.draft-v3 .geo-stage .pin .halo { display: none; }
html.draft-v3 .geo-stage .pin .station-ring { fill:none!important; stroke:#496b7c; stroke-width:.7; opacity:.5; }
html.draft-v3 .geo-stage .pin:not(.is-on):not(.office) { opacity:1; }
html.draft-v3 .geo-stage .pin .station-code { display: none; }
html.draft-v3 .geo-stage .pin text {
  fill: #344e5a;
  stroke: #dee4e6;
  stroke-width: 3px;
  paint-order: stroke fill;
  font: 600 11px/1 var(--ff-mono,ui-monospace,monospace);
  letter-spacing: .1em;
}
html.draft-v3 .map-photo {
  width: 14%;
  height: auto;
  aspect-ratio: 1.65;
  transform-origin: center;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.92);
  border-radius: 12px;
  color: #f4f7f7;
  background: linear-gradient(145deg,#34454e,#202d34);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72), 0 9px 20px rgba(35,48,54,.22), 0 2px 5px rgba(35,48,54,.11);
  transition: transform .24s cubic-bezier(.2,.7,.2,1), border-color .2s, box-shadow .2s;
}
html.draft-v3 .map-photo img { filter: saturate(.9) contrast(1.03); }
html.draft-v3 .map-photo::after { background: linear-gradient(transparent 34%,rgba(20,31,37,.76)); }
html.draft-v3 .map-photo-caption { text-shadow: 0 1px 3px rgba(12,20,24,.8); }
html.draft-v3 .map-photo.is-on { border-color: #fff; }
html.draft-v3 .map-photo:focus-visible,
html.draft-v3 .map-photo[aria-expanded="true"],
html.draft-v3 .map-photo:hover {
  z-index: 7;
  transform: translate(-50%,-50%) scale(1.35);
  border-color: #fff;
  box-shadow: inset 0 1px 0 #fff, 0 14px 28px rgba(35,48,54,.28);
}
html.draft-v3 .map-photo:focus-visible { outline: 2px solid #496b7c; outline-offset: 3px; }

html.draft-v3 .map-detail {
  position: relative;
  z-index: 2;
  min-width: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 16px;
  padding: 25px 23px;
  border: 0;
  border-left: 1px solid rgba(82,101,111,.18);
  border-radius: 0 18px 18px 0;
  color: #29363c;
  background: linear-gradient(150deg,rgba(247,249,249,.97),rgba(232,238,240,.96));
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.96), 8px 0 22px rgba(35,48,54,.06);
}
html.draft-v3 .map-detail h3 { color: #29363c; }
html.draft-v3 .map-detail .geo-ids { color: #496b7c; }
html.draft-v3 .map-detail .geo-ids span,
html.draft-v3 .map-detail .geo-city,
html.draft-v3 .map-detail .geo-facts span { color: #57666d; }
html.draft-v3 .map-detail .geo-facts { border-color: rgba(41,54,60,.16); }
html.draft-v3 .map-detail .geo-facts li { border-color: rgba(41,54,60,.13); }
html.draft-v3 .map-detail .geo-phone { color: #344e5a; }
html.draft-v3 .map-detail .btn {
  color: #29363c;
  border-color: #fff;
  background: linear-gradient(180deg,#fff,#e6ecee);
  box-shadow: inset 0 1px 0 #fff, 0 7px 16px rgba(35,48,54,.12);
}
html.draft-v3 .geo-stage .geo-fore > .note { margin: 14px 0 0; color: #57666d; }

/* Silver continues directly into Why; no pseudo-element band sits between them. */
html.draft-v3 .why { background: #dee4e6; }
html.draft-v3 .why::before { content: none; display: none; }

@media (min-width: 1100px) {
  html.draft-v3 .silver-map-shell { grid-template-columns: minmax(0,1fr) 290px; }
}
@media (max-width: 900px) {
  html.draft-v3 .silver-map-shell { grid-template-columns: minmax(0,1fr); }
  html.draft-v3 #map.map,
  html.draft-v3 .silver-map-shell > #map {
    display: flex;
    flex-direction: column;
    height: auto;
    min-height: 0;
    aspect-ratio: auto;
    border-radius: 18px 18px 0 0;
  }
  html.draft-v3 #map .silver-geography {
    position: relative;
    inset: auto;
    width: 100%;
    height: auto;
    aspect-ratio: 1000 / 620;
    flex: none;
  }
  html.draft-v3 .geo-stage .pin .station-code { display: block; }
  html.draft-v3 .map-photo-layer {
    position: relative;
    inset: auto;
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 12px;
    padding: 14px;
  }
  html.draft-v3 .map-photo-leaders { display: none; }
  html.draft-v3 #map .map-photo {
    position: relative;
    width: 100%;
    height: auto;
    aspect-ratio: 1.65;
    transform: none;
    transform-origin: center;
  }
  html.draft-v3 #map .map-photo:focus-visible,
  html.draft-v3 #map .map-photo[aria-expanded="true"],
  html.draft-v3 #map .map-photo:hover { transform: scale(1.05); }
  html.draft-v3 .map-detail {
    padding: 21px 18px;
    border-left: 0;
    border-top: 1px solid rgba(82,101,111,.18);
    border-radius: 0 0 18px 18px;
  }
}
@media (max-width: 700px) {
  html.draft-v3 .geo-stage .geo-fore { padding: 40px 0 46px; }
  html.draft-v3 .geo-stage .geo-fore .sec-head { margin-bottom: 18px; }
  html.draft-v3 .geo-codes { gap: 5px; }
  html.draft-v3 .geo-code { padding: 8px 11px; font-size: 11px; }
  html.draft-v3 .silver-map-shell { display: grid; grid-template-columns: minmax(0,1fr); border-radius: 16px; }
  html.draft-v3 #map.map,
  html.draft-v3 .silver-map-shell > #map {
    width: 100%;
    height: auto;
    min-height: 0;
    aspect-ratio: auto;
    border-radius: 16px 16px 0 0;
  }
  html.draft-v3 .map-photo-layer { grid-template-columns: repeat(2,minmax(0,1fr)); }
  html.draft-v3 .map-photo-caption { bottom: 5px; left: 6px; right: 6px; font-size: 9px; }
  html.draft-v3 .map-photo-caption strong { font-size: 12px; }
  html.draft-v3 .map-detail {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(0,1.2fr);
    gap: 10px 16px;
    padding: 20px 18px;
    border-top: 1px solid rgba(82,101,111,.18);
    border-left: 0;
    border-radius: 0 0 16px 16px;
  }
  html.draft-v3 .map-detail-actions { grid-column: 1 / -1; flex-direction: row; align-items: center; }
  html.draft-v3 .map-detail-service { display:block; grid-column:1 / -1; }
  html.draft-v3 .map-detail .geo-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
  html.draft-v3 .map-detail .geo-facts li { display:flex; flex-direction:column; align-items:flex-start; gap:5px; min-width:0; }
  html.draft-v3 .map-detail .geo-facts b { font-size:11px; white-space:normal; }
  html.draft-v3 .map-detail .geo-phone { text-align: left; white-space: normal; }
  html.draft-v3 .map-detail .btn { white-space: normal; }
}
@media (max-width: 390px) {
  html.draft-v3 .map-photo-city { max-width: none; }
}
@media (prefers-reduced-motion: reduce) {
  html.draft-v3 .map-photo { transition: none; }
}