/* HANTAN Experience V4 — open-space visual layer */
:root{
  --space-glass:rgba(5,16,37,.46);
  --space-glass-strong:rgba(5,16,37,.68);
  --space-glow:rgba(42,112,226,.17);
}

html,body{background:#01040b}

.app-shell{
  width:100vw;
  height:100svh;
  margin:0;
  border:0;
  background:#020713;
  box-shadow:none;
}

.space-video{
  position:absolute;
  z-index:0;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.91;
  filter:brightness(.66) contrast(1.08) saturate(.88);
  pointer-events:none;
  user-select:none;
}

.app-shell:before{
  content:"";
  position:absolute;
  z-index:1;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 73% 46%,rgba(23,87,190,.12),transparent 41%),
    linear-gradient(90deg,rgba(1,5,14,.52) 0%,rgba(2,8,21,.22) 38%,rgba(2,8,21,.08) 69%,rgba(1,5,14,.30) 100%),
    linear-gradient(180deg,rgba(1,5,14,.26),transparent 24%,transparent 72%,rgba(1,5,14,.34));
}

.app-shell:after{
  content:"";
  position:absolute;
  z-index:2;
  inset:0;
  pointer-events:none;
  box-shadow:inset 0 0 105px rgba(0,0,0,.32);
}

#networkCanvas{z-index:3;opacity:.82}
.ambient-grid{display:none}

.topbar,.sidebar,.stage,.footer{z-index:7}

.topbar{
  border-bottom:0;
  background:linear-gradient(180deg,rgba(2,8,20,.68),rgba(2,8,20,.13));
  backdrop-filter:blur(8px);
}

.sidebar{
  border-right:0;
  background:linear-gradient(90deg,rgba(1,6,17,.60),rgba(1,6,17,.18),transparent);
  backdrop-filter:blur(3px);
}

.nav-item{
  border-bottom:0;
  background:transparent;
}

.nav-item:before{
  background:linear-gradient(180deg,transparent,rgba(111,154,221,.26) 20%,rgba(111,154,221,.20) 80%,transparent);
}

.nav-item.is-active{
  text-shadow:0 0 18px rgba(67,217,255,.20);
}

.stage{bottom:30px}
.scene{padding-top:48px}

.footer{
  height:30px;
  border-top:0;
  color:#60779c;
  background:linear-gradient(90deg,transparent,rgba(2,8,20,.22),transparent);
}

.hero-copy{width:56%;padding-top:4.5vh}
.hero-copy .lead{color:#9aacc7;text-shadow:0 2px 18px rgba(0,0,0,.45)}
.hero-signals{margin-top:56px}

.hero-system{
  right:0;
  top:14%;
  opacity:.77;
  filter:drop-shadow(0 0 22px rgba(38,104,211,.10));
}

.ghost-action{
  border:0;
  border-radius:999px;
  background:rgba(52,105,190,.10);
  box-shadow:0 0 28px rgba(33,99,209,.08) inset;
}

.corporate-registry{
  right:42px;
  top:22px;
  bottom:auto;
  width:min(35vw,470px);
  border:0;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(6,21,48,.72),rgba(4,13,31,.39));
  box-shadow:0 24px 70px rgba(0,0,0,.31),0 0 46px rgba(32,96,204,.08);
  backdrop-filter:blur(17px) saturate(112%);
}

.corporate-registry:before{
  width:1px;
  top:16px;
  bottom:16px;
  height:auto;
  border-radius:999px;
}

.corporate-registry:after{opacity:.45}
.registry-head{border-bottom:0;padding-bottom:9px}
.registry-grid{gap:4px;padding:0 10px 8px}
.registry-grid>div{
  border-right:0;
  border-radius:11px;
  background:rgba(28,68,127,.075);
}
.registry-open{
  margin:0 10px 10px;
  width:calc(100% - 20px);
  border-top:0;
  border-radius:999px;
  background:rgba(55,113,207,.09);
}

.company-flow{
  gap:14px;
  border-top:0;
  border-bottom:0;
}
.company-flow article,
.company-flow article:first-child{
  border:0;
  border-radius:18px;
  background:linear-gradient(155deg,rgba(9,30,64,.50),rgba(5,17,39,.26));
  box-shadow:0 18px 56px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.025);
  backdrop-filter:blur(8px);
}

.lab-stack,.lab-group-label,.lab-prototype-grid{
  border:0;
}
.lab-group-label{padding:0 8px}
.lab-featured,.lab-prototype-grid>.lab-row{
  border:0;
  border-radius:17px;
  background:linear-gradient(145deg,rgba(8,28,61,.53),rgba(5,16,37,.27));
  box-shadow:0 18px 52px rgba(0,0,0,.14),inset 0 1px 0 rgba(255,255,255,.025);
  backdrop-filter:blur(8px);
}
.lab-featured{margin-top:7px}
.lab-development-label{margin-top:18px}
.lab-prototype-grid{gap:13px}
.lab-prototype-grid>.lab-row:first-child{border-right:0}
.lab-row{border-bottom:0}
.lab-visual{border-left:0;border-right:0}
.lab-data{border-left:0}

.contact-mail{
  border-bottom:0;
  padding:12px 18px;
  border-radius:999px;
  background:rgba(32,100,205,.09);
  box-shadow:0 0 32px rgba(34,111,228,.07) inset;
}

/* Keep operational lines, nodes and orbits; remove hard structural frames. */
.orbit,.radar,.circuit-lines,.nav-item:before,.nav-item.is-active:after{
  visibility:visible;
}

.registry-dialog{
  border:0;
  border-radius:20px;
  overflow:hidden;
}
.registry-dialog-shell{background:radial-gradient(circle at 88% 14%,rgba(27,91,185,.20),transparent 34%),rgba(3,12,29,.94)}
.registry-details{gap:8px;border:0}
.registry-details>div{border:0;border-radius:12px;background:rgba(24,62,119,.12)}
.registry-notice{border:0;border-radius:12px}
.registry-close{border:0;border-radius:50%;background:rgba(36,83,155,.16)}

.transition-layer{display:none!important}
.scene.is-entering>*{animation:none!important}

@media(max-width:1250px) and (min-width:761px){
  .corporate-registry{right:26px;top:20px;width:min(40vw,440px)}
  .hero-system{right:-5%;top:18%}
}

@media(max-width:1100px) and (min-width:761px){
  .corporate-registry{right:22px;top:20px;bottom:auto;width:min(43vw,410px)}
}

@media(max-width:760px){
  .space-video{opacity:.87;filter:brightness(.58) contrast(1.09) saturate(.84)}
  .app-shell:before{background:linear-gradient(180deg,rgba(1,5,14,.40),rgba(2,8,21,.14) 45%,rgba(1,5,14,.42))}
  .topbar{background:rgba(2,8,20,.45)}
  .sidebar{
    border-top:0;
    background:rgba(2,8,20,.73);
    backdrop-filter:blur(13px);
  }
  .nav-item{border-right:0}
  .scene{padding-top:30px}
  .hero-system{right:-40%;top:22%;opacity:.25}
  .corporate-registry{
    position:relative;
    right:auto;
    top:auto;
    bottom:auto;
    width:100%;
    margin-top:34px;
  }
  .company-flow{gap:12px}
  .company-flow article{margin-bottom:12px}
  .lab-prototype-grid{gap:10px}
  .lab-prototype-grid>.lab-row:first-child{border-bottom:0}
}


/* V4.1 — üst alan uzay sahnesiyle tek yüzey */
.topbar{
  background:transparent !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  box-shadow:none !important;
  border-bottom:0 !important;
}

/* Şeffaf üst alanda metin ve işaretlerin okunurluğu */
.topbar .brand,
.topbar .center-status,
.topbar .top-meta{
  filter:none !important;
  text-shadow:0 2px 16px rgba(0,0,0,.72);
}

@media(max-width:760px){
  .topbar{
    background:transparent !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
  }
}

/* V4.2 — mouse-controlled panoramic background */
.space-video{
  transform-origin:center center;
  transform:translate3d(0,0,0) scale(var(--space-panorama-scale,1.30));
  will-change:transform,opacity;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}

.space-video-error .space-video{
  opacity:0;
}

@media (prefers-reduced-motion:reduce){
  .space-video{
    transform:translate3d(0,0,0) scale(var(--space-panorama-scale,1.30)) !important;
  }
}

/* V4.3 — mobile panorama without horizontal page scrolling */
html,
body{
  width:100%;
  max-width:100%;
  overflow-x:hidden!important;
  overscroll-behavior-x:none;
}

.app-shell{
  width:100%;
  max-width:100%;
  overflow:hidden;
  overscroll-behavior-x:none;
}

.space-video{
  max-width:none;
  will-change:transform;
  transform-origin:50% 50%;
  backface-visibility:hidden;
}

.stage,
.scene{
  max-width:100%;
  overflow-x:hidden;
}

@media(max-width:760px){
  body{
    overflow-x:hidden!important;
    overscroll-behavior-x:none;
  }

  .app-shell{
    width:100%;
    max-width:100%;
    touch-action:pan-y pinch-zoom;
  }

  .stage,
  .scene{
    width:100%;
    max-width:100%;
    overflow-x:hidden!important;
  }

  .scene{
    -webkit-overflow-scrolling:touch;
  }

  .space-video{
    width:100%;
    height:100%;
    object-fit:cover;
  }
}

/* V4.4 — mobile content clearance above the fixed navigation */
@media(max-width:760px){
  :root{--mobile-nav-height:70px}

  .app-shell{
    height:100dvh;
    min-height:100dvh;
  }

  .sidebar{
    z-index:30;
    height:calc(var(--mobile-nav-height) + env(safe-area-inset-bottom));
    padding-bottom:env(safe-area-inset-bottom);
    background:rgba(2,8,20,.97);
  }

  .side-nav{
    height:var(--mobile-nav-height);
  }

  .stage{
    bottom:calc(var(--mobile-nav-height) + env(safe-area-inset-bottom));
    overflow:hidden;
  }

  .scene{
    inset:0;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding-bottom:calc(42px + env(safe-area-inset-bottom));
    scroll-padding-bottom:calc(42px + env(safe-area-inset-bottom));
  }
}


/* V4.6 — hidden native scrollbar + HANTAN double-diode position indicator */
html,
body,
.scene,
.company-flow,
.lab-stack{
  scrollbar-width:none;
  -ms-overflow-style:none;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
.scene::-webkit-scrollbar,
.company-flow::-webkit-scrollbar,
.lab-stack::-webkit-scrollbar{
  width:0;
  height:0;
  display:none;
}

.hantan-scroll-indicator{
  --indicator-height:132px;
  position:absolute;
  z-index:26;
  right:7px;
  top:50%;
  width:16px;
  height:var(--indicator-height);
  transform:translateY(-50%);
  pointer-events:none;
  opacity:0;
  transition:opacity .32s ease;
}

.hantan-scroll-indicator.is-visible{opacity:.48}
.hantan-scroll-indicator.is-scrolling{opacity:1}

.hantan-scroll-track{
  position:absolute;
  left:50%;
  top:0;
  width:1px;
  height:100%;
  transform:translateX(-50%);
  background:linear-gradient(180deg,transparent,rgba(67,217,255,.20) 18%,rgba(67,217,255,.26) 50%,rgba(66,229,150,.18) 82%,transparent);
  box-shadow:0 0 7px rgba(67,217,255,.10);
}

.hantan-scroll-track:before,
.hantan-scroll-track:after{
  content:"";
  position:absolute;
  left:50%;
  width:5px;
  height:1px;
  transform:translateX(-50%);
  background:rgba(67,217,255,.38);
  box-shadow:0 0 6px rgba(67,217,255,.20);
}

.hantan-scroll-track:before{top:0}
.hantan-scroll-track:after{bottom:0;background:rgba(66,229,150,.34)}

.hantan-scroll-lights{
  position:absolute;
  left:50%;
  top:0;
  display:grid;
  gap:4px;
  padding:3px 2px;
  transform:translate3d(-50%,0,0);
  will-change:transform;
  transition:transform .11s linear;
}

.hantan-scroll-diode{
  display:block;
  width:5px;
  height:5px;
  border-radius:50%;
  background:currentColor;
}

.hantan-scroll-diode-cyan{
  color:var(--cyan);
  box-shadow:0 0 4px currentColor,0 0 11px rgba(67,217,255,.70),0 0 20px rgba(67,217,255,.28);
}

.hantan-scroll-diode-green{
  color:var(--green);
  box-shadow:0 0 4px currentColor,0 0 11px rgba(66,229,150,.64),0 0 20px rgba(66,229,150,.24);
}

@media(max-width:760px){
  .hantan-scroll-indicator{
    --indicator-height:104px;
    right:3px;
    width:12px;
  }
  .hantan-scroll-diode{width:4px;height:4px}
  .hantan-scroll-lights{gap:3px;padding:2px 1px}
}

@media(prefers-reduced-motion:reduce){
  .hantan-scroll-lights{transition:none}
}


/* HANTAN BUILD 2026-08-07 — registry belongs to contact scene */
.scene[data-panel="contact"] .corporate-registry{
  right:42px;
  top:22px;
  bottom:auto;
}
@media(max-width:760px){
  .scene[data-panel="contact"] .corporate-registry{
    position:relative;
    right:auto;
    top:auto;
    bottom:auto;
    width:100%;
    margin-top:38px;
  }
}
