:root{color-scheme:dark;--bg:#02060b}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--bg)}
body{font-family:"Segoe UI",Arial,sans-serif;overflow-x:hidden}
.site-stage{width:100%;display:flex;justify-content:center;background:#02060b}
.design-wrap{position:relative;width:100%;max-width:1536px;line-height:0;overflow:hidden;background:#02060b}
.design-image{display:block;width:100%;height:auto;user-select:none;-webkit-user-drag:none}
#circuit-bg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2;mix-blend-mode:screen}
.hotspot{position:absolute;z-index:3;display:block;border-radius:18px;outline:none}
.hotspot:focus-visible{box-shadow:0 0 0 2px #fff,0 0 0 5px #00a9ff}

html{scroll-behavior:smooth;scroll-padding-top:18px}
.scroll-target{position:absolute;left:0;width:1px;height:1px;pointer-events:none;scroll-margin-top:18px}
/* Üst menü: 1536x1024 tasarım üzerindeki gerçek yazı alanları */
.hotspot.nav-home{left:22.7%;top:1.55%;width:7.3%;height:4.9%}
.hotspot.nav-services{left:31.2%;top:1.55%;width:9.9%;height:4.9%}
.hotspot.nav-solutions{left:42.4%;top:1.55%;width:9.2%;height:4.9%}
.hotspot.nav-tech{left:53.2%;top:1.55%;width:11.6%;height:4.9%}
.hotspot.nav-contact{left:66.0%;top:1.55%;width:6.4%;height:4.9%}
.hotspot.hero-services{left:28.6%;top:39.2%;width:19.2%;height:5.0%}

/* Koordinatlar 1536x1024 tasarıma göre yüzde ile hizalıdır. */
.hotspot.contact{left:85.9%;top:1.8%;width:11.4%;height:4.8%}
.hotspot.mail{left:37.9%;top:90.4%;width:12.2%;height:2.6%}
.hotspot.gmail{left:37.9%;top:93.1%;width:12.2%;height:2.6%}
@media(max-width:700px){
  .hotspot{border-radius:8px}
}
@media(prefers-reduced-motion:reduce){#circuit-bg{opacity:.35}}