/* v2.58: same category / menu / testimonial / about toolbar as homepage. */
/* Existing site navbar remains available on other pages, but does not compete
   with the shared navigation on a standalone project. */
body.portfolio-universal-project #site-navbar { display:none!important; }
body.portfolio-universal-project .grid-toolbar {
  position:fixed;top:max(18px,env(safe-area-inset-top));right:max(18px,env(safe-area-inset-right));
  z-index:90;display:flex;gap:2px;max-width:calc(100vw - 36px);align-items:center;
  padding:5px;background:rgba(250,249,246,.90);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border:1px solid rgba(0,0,0,.08);border-radius:4px;
  font-family:Inter,Arial,sans-serif;box-sizing:border-box;
}
body.portfolio-universal-project .grid-toolbar * {box-sizing:border-box}
body.portfolio-universal-project .grid-toolbar button {
  display:grid;place-items:center;width:42px;height:42px;padding:10px;
  color:#171719;background:none;border:0;border-radius:0;cursor:pointer;
}
body.portfolio-universal-project .grid-toolbar button:hover,
body.portfolio-universal-project .grid-filter-link:hover {background:rgba(0,0,0,.07)}
body.portfolio-universal-project .grid-toolbar button:focus-visible,
body.portfolio-universal-project .grid-toolbar a:focus-visible {outline:2px solid #325eac;outline-offset:1px}
body.portfolio-universal-project .grid-toolbar svg {width:25px;height:25px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:square;stroke-linejoin:round}
body.portfolio-universal-project .grid-toolbar .grid-quote-mark{fill:currentColor;stroke:none}
body.portfolio-universal-project .grid-filters {display:flex;align-items:center;gap:2px;min-width:0;overflow-x:auto;scrollbar-width:thin}
body.portfolio-universal-project .grid-filter-link {
  display:flex;align-items:center;flex:0 0 auto;padding:0 12px;min-height:42px;
  font:600 11px Inter,Arial,sans-serif;white-space:nowrap;text-decoration:none;
  color:#171719;background:transparent;
}
body.portfolio-universal-project .grid-drawer-controls{display:flex;flex-shrink:0;border-left:1px solid rgba(0,0,0,.15);padding-left:5px;margin-left:5px}
body.portfolio-universal-project .grid-scrim{position:fixed;inset:0;z-index:100;background:rgba(15,17,22,.32);backdrop-filter:blur(2px)}
body.portfolio-universal-project .grid-scrim[hidden]{display:none!important}
/* Use homepage side-panel size and entrance instead of the old sliding-width menu. */
body.portfolio-universal-project .sidenav {
  position:fixed!important;inset:0 0 0 auto!important;z-index:110!important;
  width:min(420px,100vw)!important;height:100dvh!important;
  padding:72px 28px 30px!important;margin:0!important;border-radius:0!important;
  border:0!important;background:#faf9f6!important;color:#242426!important;
  box-shadow:-8px 0 40px rgba(0,0,0,.12)!important;
  transform:translateX(105%)!important;visibility:hidden!important;
  transition:transform .28s ease,visibility .28s!important;
  overflow:auto!important;overscroll-behavior:contain;text-align:left!important;
}
body.portfolio-universal-project .sidenav.grid-drawer-open {transform:translateX(0)!important;visibility:visible!important}
body.portfolio-universal-project .sidenav .closebtn{
  position:absolute!important;top:17px!important;right:22px!important;left:auto!important;
  margin:0!important;padding:0!important;width:44px!important;height:44px!important;
  line-height:40px!important;text-align:center!important;font-size:32px!important;
  background:none!important;border:0!important;color:#202022!important;cursor:pointer;text-decoration:none;
}
body.portfolio-universal-project .sidenav-inner,
body.portfolio-universal-project .testimonial-nav-content{padding:0!important;margin:0!important;width:auto!important;min-width:0!important}
body.portfolio-universal-project .sidenav-heading{color:#75736f;font-size:11px;letter-spacing:.12em}
body.portfolio-universal-project .sidenav a:not(.closebtn){color:#252527}
body.portfolio-universal-project .sidenav a:not(.closebtn):hover{color:#325eac}
body.portfolio-universal-project.grid-drawer-active{overflow:hidden}
body.portfolio-universal-project .grid-about-content h2{font-size:42px;font-weight:800;letter-spacing:-.045em;line-height:1.05;margin:12px 0 22px}
body.portfolio-universal-project .grid-about-eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.15em;color:#777;margin:0}
body.portfolio-universal-project .grid-about-role{font-size:17px;line-height:1.5;font-weight:600;margin:0 0 24px}
body.portfolio-universal-project .grid-about-bio{font-size:16px;line-height:1.8}
body.portfolio-universal-project .grid-about-links{margin-top:32px;border-top:1px solid #d9d6d0}
body.portfolio-universal-project .grid-about-links a{display:flex;justify-content:space-between;padding:18px 0;font-size:16px;border-bottom:1px solid #d9d6d0;text-decoration:none}
body.portfolio-universal-project .grid-about-video{margin:0 0 26px;width:100%;background:#151515;overflow:hidden;border-radius:2px}
body.portfolio-universal-project .grid-about-video video{display:block;width:100%;aspect-ratio:16/9;background:#151515}
body.portfolio-universal-project .testimonial-avatar{width:60px!important;height:60px!important;min-width:60px!important;max-width:60px!important;border-radius:50%;object-fit:cover}
body.portfolio-universal-project .testimonial-person{display:flex;align-items:center;gap:12px}
/* The comparison's Before/After flags must not sit behind the toolbar.
   This is specific to project hero stages: popup comparison remains unchanged. */
body.portfolio-universal-project .screen-gallery-hero .media-compare-label{
  top:max(92px,calc(env(safe-area-inset-top) + 90px))!important;
}
@media(max-width:900px){
  body.portfolio-universal-project .grid-toolbar{flex-wrap:wrap;justify-content:flex-end;max-width:calc(100vw - 24px)}
  body.portfolio-universal-project .grid-filters{flex:1 1 100%;order:2;border-top:1px solid rgba(0,0,0,.1);padding-top:3px}
  body.portfolio-universal-project .grid-drawer-controls{border:0;margin:0;padding:0}
  body.portfolio-universal-project .grid-filter-link{padding:0 10px;min-height:38px}
  body.portfolio-universal-project .screen-gallery-hero .media-compare-label{
    top:max(130px,calc(env(safe-area-inset-top) + 122px))!important;
  }
}
@media(max-width:700px){
  body.portfolio-universal-project .grid-toolbar{top:12px;right:12px;padding:3px}
  body.portfolio-universal-project .grid-toolbar button{width:38px;height:38px;padding:9px}
  body.portfolio-universal-project .screen-gallery-hero .media-compare-label{
    top:max(120px,calc(env(safe-area-inset-top) + 110px))!important;
  }
}
@media(prefers-reduced-motion:reduce){
 body.portfolio-universal-project .sidenav{transition:none!important}
}

/* Home itself needs no restyling; its existing work-grid.css remains authoritative. */