/* Shared side navigation — Home + project internals
   Keep this file as the single source of truth for the two side links. */
.site-header.shared-side-nav{
  position:fixed !important;
  inset:0 !important;
  width:100% !important;
  height:100vh !important;
  padding:0 !important;
  z-index:30 !important;
  pointer-events:none !important;
}

.shared-side-nav .nav-link{
  position:absolute !important;
  top:35px !important;
  width:.82em !important;
  padding:0 !important;
  margin:0 !important;
  color:var(--orange) !important;
  font-size:clamp(30px,2vw,40px) !important;
  font-weight:400 !important;
  line-height:.55 !important;
  letter-spacing:0 !important;
  text-transform:lowercase !important;
  writing-mode:horizontal-tb !important;
  text-orientation:mixed !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-all !important;
  text-align:left !important;
  text-decoration:none !important;
  border:0 !important;
  outline-offset:5px;
  opacity:0;
  transform:translateY(-9px);
  animation:sharedNavIn .9s var(--ease) .08s forwards !important;
  transition:color .3s ease !important;
  pointer-events:auto !important;
}

.shared-side-nav .nav-contact{left:clamp(18px,2.7vw,42px) !important}
.shared-side-nav .nav-home{right:clamp(18px,2.7vw,42px) !important;animation-delay:.16s !important}

/* No decorative hover rule/line on either Home or project pages. */
.shared-side-nav .nav-link::before,
.shared-side-nav .nav-link::after{
  content:none !important;
  display:none !important;
  width:0 !important;
  height:0 !important;
  border:0 !important;
  background:none !important;
  transform:none !important;
}

.shared-side-nav .nav-link:hover{
  color:var(--red) !important;
  transform:none !important;
  text-decoration:none !important;
}

@keyframes sharedNavIn{to{opacity:1;transform:translateY(0)}}

@media (max-width:980px) and (min-width:681px){
  .shared-side-nav .nav-link{
    top:40px !important;
    font-size:18px !important;
  }
  .shared-side-nav .nav-contact{left:14px !important}
  .shared-side-nav .nav-home{right:14px !important}
}

/* Mobile: keep contact/home stacked vertically beside the portfolio.
   text-orientation: upright keeps letters readable without rotating the words. */
@media (max-width:680px){
  .site-header.shared-side-nav{height:100dvh !important}
  .shared-side-nav .nav-link{
    top:0 !important;
    width:auto !important;
    padding:6px 4px !important;
    font-size:24px !important;
    font-weight:400 !important;
    line-height:1.1 !important;
    letter-spacing:-.65em !important;
    writing-mode:vertical-rl !important;
    text-orientation:upright !important;
    white-space:nowrap !important;
    overflow-wrap:normal !important;
    word-break:normal !important;
    text-align:center !important;
  }
  .shared-side-nav .nav-contact{left:max(7px,env(safe-area-inset-left)) !important}
  .shared-side-nav .nav-home{right:max(7px,env(safe-area-inset-right)) !important}
}

@media (max-width:380px){
  .shared-side-nav .nav-link{font-size:17px !important}
}

@media (prefers-reduced-motion:reduce){
  .shared-side-nav .nav-link{opacity:1 !important;transform:none !important;animation:none !important}
}
