.hs-net { --net-motion: running; position: relative; min-width: 0; padding: 22px; overflow: hidden; border: 1px solid #b59ad32b; border-radius: 24px; background: radial-gradient(ellipse at 50% 36%,#55308735,transparent 60%),linear-gradient(145deg,#171024,#0f1020); box-shadow: 0 25px 75px #05011035,inset 0 1px #ffffff0a; }
.hs-net::before { content: ''; position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(#c8a9f508 1px,transparent 1px),linear-gradient(90deg,#c8a9f508 1px,transparent 1px); background-size: 35px 35px; mask-image: radial-gradient(ellipse at center,#000,transparent 75%); }
.hs-net > * { position: relative; }
.hs-net-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.hs-net-eyebrow { display: flex; align-items: center; gap: 8px; color: #c5afd9; font-size: 9px; letter-spacing: 1.4px; font-weight: 700; }
.hs-net-eyebrow i { width: 5px; height: 5px; background: #74e6c6; border-radius: 50%; box-shadow: 0 0 12px #68e3c8; }
.hs-net-tour { display: inline-flex; gap: 7px; align-items: center; padding: 7px 10px; color: #c8b4df; background: #ffffff05; border: 1px solid #d9bafa24; border-radius: 20px; font-size: 9px; cursor: pointer; }
.hs-net-tour svg { width: 12px; height: 12px; }.hs-net-tour:hover { color: #fff; background: #ffffff10; }
.hs-net-map { position: relative; margin: 18px -10px 6px; aspect-ratio: 1005/490; isolation: isolate; }
.hs-net-art { display: block; width: 100%; height: 100%; overflow: visible; }
.hs-net-provinces > g { fill: url(#hs-net-land); stroke: #20162f; stroke-width: .9; transition: fill .45s,stroke .45s,filter .45s; }
.hs-net-provinces > g.is-selected { fill: #a679fa; stroke: #ebd8ff; filter: drop-shadow(0 0 8px #a679fa90); }
.hs-net-orbits { fill: none; stroke: #b08acf; stroke-opacity: .12; stroke-width: 1; }
.hs-net-route { fill: none; stroke: url(#hs-net-link); stroke-width: 1.6; opacity: .65; }
.hs-net-flow { fill: none; stroke: #9afbe6; stroke-width: 2.5; stroke-linecap: round; stroke-dasharray: 3 110; animation: hn-flow 7s linear infinite; filter: drop-shadow(0 0 4px #67e2d0); }
.hs-net-origin { fill: none; stroke: #98e9d1; stroke-width: 1.2; opacity: .5; transform-box: fill-box; transform-origin: center; animation: hn-pulse 3.6s ease-out infinite; }
.hs-net-pins { position: absolute; inset: 0; }
.hs-net-pin { position: absolute; width: 32px; height: 32px; transform: translate(-50%,-50%); display: grid; place-items: center; padding: 0; border: 0; background: transparent; cursor: pointer; z-index: 2; }
.hs-net-pin > i { width: 9px; height: 9px; border: 2px solid #d1b6ff; border-radius: 50%; background: #7843c9; box-shadow: 0 0 0 5px #b58aea16,0 0 14px #b48bfa60; transition: background .3s,box-shadow .3s; }
.hs-net-pin > span { position: absolute; top: 32px; left: 50%; transform: translateX(-50%); padding: 4px 7px; border-radius: 5px; background: #120d21df; border: 1px solid #c6a7f026; color: #c5b2d8; font-size: 9px; font-weight: 600; white-space: nowrap; pointer-events: none; }
.hs-net-pin[data-city="istanbul"] > span, .hs-net-pin[data-city="ankara"] > span, .hs-net-pin[data-city="samsun"] > span { top: auto; bottom: 32px; }
.hs-net-pin[data-city="bursa"] > span { left: 28px; top: 16px; transform: none; }
.hs-net-pin[data-city="gaziantep"] > span { top: 25px; left: 30px; transform: none; }
.hs-net-pin[aria-pressed="true"] { z-index: 3; }.hs-net-pin[aria-pressed="true"] > i { background: #8af1d1; border-color: #d1fff0; box-shadow: 0 0 0 7px #7be3c521,0 0 25px #79efd4aa; }
.hs-net-pin[aria-pressed="true"] > span, .hs-net-pin:hover > span { color: #f4fff9; border-color: #7fe3c369; background: #163730ed; }
.hs-net-detail { display: flex; align-items: center; gap: 14px; padding: 16px 17px; margin: 8px 0 14px; border: 1px solid #b596dd24; background: linear-gradient(100deg,#6d3caa16,#60e1c407); border-radius: 12px; }
.hs-net-detail-icon { width: 38px; height: 38px; flex-shrink: 0; display: grid; place-items: center; border-radius: 11px; background: #8956c622; color: #c9a6fb; border: 1px solid #b69add26; }.hs-net-detail-icon svg { width: 20px; height: 20px; }
.hs-net-detail > div { min-width: 0; }.hs-net-detail-title { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }.hs-net-detail h3 { margin: 0; color: #f2eafb; font-size: 19px; font-weight: 650; }.hs-net-detail-title span { font-size: 9px; color: #80d7bb; }
.hs-net-detail p { margin: 7px 0 0; color: #a99cba; font-size: 11px; line-height: 1.6; }
.hs-net-cities { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 6px; }
.hs-net-cities button { min-width: 0; min-height: 31px; padding: 7px 4px; color: #a99bbf; background: #ffffff03; border: 1px solid #c0a1e719; border-radius: 7px; cursor: pointer; font-size: 10px; transition: background .2s,border-color .2s; }
.hs-net-cities button:hover { color: #e8daf7; background: #9a6ad116; }.hs-net-cities button[aria-pressed="true"] { background: #6f3bae30; border-color: #a575dd6b; color: #eedfff; }
.hs-net-foot { display: flex; justify-content: space-between; gap: 12px; margin-top: 13px; color: #82748f; font-size: 8px; line-height: 1.5; }.hs-net-foot span:first-child { color: #ad98c1; }
.hs-net button:focus-visible { outline: 2px solid #9de5cb; outline-offset: 3px; }
.hs-net *, .hs-net *::after { animation-play-state: var(--net-motion); }
.hs-net[data-paused],.hs-net[data-offscreen] { --net-motion: paused; }
@keyframes hn-flow { to { stroke-dashoffset: -339; } }
@keyframes hn-pulse { 0% { transform: scale(.5); opacity: .65; } 85%,100% { transform: scale(1.9); opacity: 0; } }
@media(max-width:600px) {
  .hs-net { padding: 16px 12px; border-radius: 17px; }.hs-net-eyebrow { font-size: 8px; letter-spacing: .8px; }.hs-net-tour { padding: 7px 8px; font-size: 8px; }
  .hs-net-map { margin: 30px -5px 22px; }.hs-net-pin { width: 28px; height: 28px; }.hs-net-pin > i { width: 7px; height: 7px; }.hs-net-pin > span { display: none; }.hs-net-pin[aria-pressed="true"] > span { display: block; font-size: 8px; }
  .hs-net-cities { grid-template-columns: repeat(3,minmax(0,1fr)); }.hs-net-cities button { min-height: 36px; font-size: 10px; }
  .hs-net-detail { padding: 13px 11px; gap: 10px; }.hs-net-detail h3 { font-size: 17px; }.hs-net-detail-title { gap: 5px 9px; }.hs-net-detail p { font-size: 10px; }.hs-net-detail-icon { width: 32px; height: 32px; }.hs-net-foot { font-size: 7px; }
}
@media(prefers-reduced-motion:reduce) { .hs-net * { animation: none !important; transition: none !important; }.hs-net-origin { opacity: .25; } }

.hs-net-sr {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
