/* PRECISION APP SHELL
   Keeps site-wide UI alive while only the route content changes.
   Home visual CSS remains in style.css unchanged. */

html, body {
  background:#000;
}

.precision-global-music{
  position:fixed !important;
  z-index:1000 !important;
}

.precision-global-nav{
  position:fixed;
  top:18px;
  right:22px;
  z-index:1000;
  display:flex;
  align-items:center;
  gap:20px;
  font-family:Calibri,Arial,sans-serif;
  font-size:10px;
  font-weight:400;
  letter-spacing:.16em;
  opacity:1;
  visibility:visible;
  transition:opacity .15s ease,visibility .15s ease;
}

body[data-route="home"] .precision-global-nav{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

.precision-global-nav button,
.precision-global-nav a{
  appearance:none;
  border:0;
  background:none;
  padding:4px 0;
  color:rgba(239,241,244,.60);
  font:inherit;
  letter-spacing:inherit;
  text-decoration:none;
  cursor:pointer;
  transition:color .18s ease;
}

.precision-global-nav button:hover,
.precision-global-nav a:hover{
  color:#fff;
}

.precision-route-view{
  background:#000;
}

.precision-route-view--home{
  position:relative;
  z-index:1;
}

.precision-route-view--section{
  position:fixed;
  inset:0;
  z-index:5;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  background:#000;
  overflow:hidden;
}

body[data-route="engineering"] [data-view="engineering"],
body[data-route="design"] [data-view="design"],
body[data-route="lab"] [data-view="lab"]{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

body:not([data-route="home"]) .precision-route-view--home{
  position:fixed;
  inset:0;
  z-index:-1;
  visibility:hidden;
  pointer-events:none;
  overflow:hidden;
}

body:not([data-route="home"]){
  overflow:hidden;
}

.precision-section-stage{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  background:#000;
  overflow:hidden;
}

.precision-section-visual{
  display:block;
  width:100vw;
  height:100vh;
  height:100dvh;
  object-fit:contain;
  object-position:center;
  background:#000;
  transform:translateZ(0);
}

@media(max-width:760px){
  .precision-global-nav{
    top:12px;
    right:14px;
    gap:14px;
    font-size:9px;
  }
}


/* Whole-card navigation on Home */
.division[data-section-route]{
  cursor:pointer;
}

.division[data-section-route]:focus-visible{
  outline:1px solid rgba(205,145,91,.72);
  outline-offset:-3px;
}

.division[data-section-route] .explore b{
  transition:transform .18s ease;
}

.division[data-section-route]:hover .explore b,
.division[data-section-route]:focus-visible .explore b{
  transform:translateX(4px);
}
