/* 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;
  left:22px;
  right:auto;
  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;
    left:14px;
    right:auto;
    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);
}


/* Route interaction guard: hidden section descendants must never intercept Home pointer input. */
body:not([data-route="engineering"]) [data-view="engineering"],
body:not([data-route="engineering"]) [data-view="engineering"] *,
body:not([data-route="design"]) [data-view="design"],
body:not([data-route="design"]) [data-view="design"] *,
body:not([data-route="lab"]) [data-view="lab"],
body:not([data-route="lab"]) [data-view="lab"] *{
  pointer-events:none !important;
}

/* Global navigation participates in the same 6-unit minimum typography tier. */
.precision-global-nav{font-size:var(--p-cal-small,12px)!important}


/* Mobile portrait: let the fixed music controls slide away while reading. */
.precision-global-music{transition:transform .42s cubic-bezier(.22,.74,.16,1),opacity .28s ease;will-change:transform,opacity}
@media (max-width:900px) and (orientation:portrait){
  body.music-collapsed .precision-global-music{
    transform:translateY(calc(-100% - 18px));
    opacity:0;
    pointer-events:none;
  }
}

/* Keep the persistent navigation and player as two clean, non-overlapping
   groups on phones. The essential playback controls remain available. */
@media (max-width:760px) and (orientation:portrait){
  .precision-global-music{
    left:138px!important;
    right:10px!important;
    width:calc(100vw - 148px)!important;
    max-width:calc(100vw - 148px)!important;
  }
  .precision-global-music #shuffleTrack,
  .precision-global-music #repeatOneTrack,
  .precision-global-music #volumeDown,
  .precision-global-music #volumeUp,
  .precision-global-music #volumeLevel{display:none!important}
}
