/* Quiet refinements, retaining the original two-column composition. */
:root { --ui-ease:cubic-bezier(.22,.68,0,1); --index-blue:#6f8caf; }
.site-nav a { transition:color 160ms ease,opacity 160ms ease; }
.site-nav .project-link,.site-nav .project-link.active { color:rgba(0,0,0,.75); }
.site-nav .nav-title {
  background-image:linear-gradient(var(--index-blue),var(--index-blue));
  background-position:0 54%; background-repeat:no-repeat; background-size:0% 1px;
  -webkit-box-decoration-break:clone; box-decoration-break:clone;
  transition:background-size 480ms var(--ui-ease);
}
.site-nav.nav-ready .project-link[aria-current="page"] .nav-title,
.site-nav .project-link.is-opening .nav-title { background-size:100% 1px; }
.site-nav .project-link:focus-visible { color:#000; }
.site-nav :is(a,button,media-item):focus-visible { outline-color:var(--index-blue); }
@media (hover:hover) {
  .site-nav .project-link:hover { color:#000; }
  .site-nav .project-link:not([aria-current="page"]):not(.is-opening):hover .nav-title { background-size:.8em 1px; }
  .slide-button { opacity:0; }
  gallery-slideshow:hover .slide-button,gallery-slideshow:focus-within .slide-button { opacity:1; }
  .slide-button:hover,.lightbox button:hover { background-color:rgba(70,70,70,.5); color:#fff; }
}
.slide-button,.slide-toggle,.lightbox button { transition:opacity 180ms ease,background-color 180ms ease,color 180ms ease; touch-action:manipulation; }
.slide-button::before { content:""; position:absolute; inset:-7px; }
.slide-button:focus-visible,.slide-toggle:focus-visible { opacity:1; }
.lightbox .counter { pointer-events:none; }
/* Give long project descriptions a calmer reading rhythm. */
main .copy { line-height:1.42!important; color:#626262; }
main .copy :is(b,strong) { color:#414141; }
main .copy + :is(media-item,gallery-slideshow,gallery-grid,gallery-justify) { margin-top:1.1rem; }
main .copy ul { margin-top:.3em; margin-bottom:.3em; }
main .copy li + li { margin-top:.16em; }
main .copy a { text-decoration-thickness:1px; text-underline-offset:.18em; }
/* Small, steady navigation feedback; the images keep the visual emphasis. */
.slide-counter { position:absolute; left:14px; bottom:13px; z-index:2; padding:5px 7px; border-radius:3px; color:#fff; background:rgba(24,24,24,.58); font:11px/1 Arial,Helvetica,sans-serif; font-variant-numeric:tabular-nums; letter-spacing:.06em; pointer-events:none; }
.slide-progress { position:absolute; inset:auto 0 0; height:2px; z-index:2; pointer-events:none; background:rgba(127,127,127,.12); }
.slide-progress > span { display:block; width:100%; height:100%; transform:scaleX(0); transform-origin:left; background:rgba(90,90,90,.55); }
gallery-slideshow > media-item { background:var(--slide-surface,#fff); }
.slide-button { width:34px; height:34px; background:rgba(35,35,35,.44); }
.slide-toggle { bottom:12px; min-height:24px; padding:6px 9px; border-radius:3px; background:rgba(24,24,24,.58); }
.slide-button:active,.lightbox button:active { background:rgba(0,0,0,.7); }
.lightbox [hidden] { display:none!important; }
.lightbox .counter { font-variant-numeric:tabular-nums; letter-spacing:.04em; }
/* The flag keeps its footprint while its message gently replaces it. */
.site-nav .pride-flag { overflow:visible; -webkit-user-select:none; user-select:none; }
.site-nav .pride-flag::before {
  content:""; position:absolute; inset:-6px; pointer-events:none;
}
.site-nav .pride-flag > img {
  transition:opacity 220ms var(--ui-ease),transform 280ms var(--ui-ease);
  transform-origin:left center;
}
.site-nav .pride-flag > .pride-message {
  position:absolute; left:0; top:50%; width:max-content;
  font:600 clamp(14px,1.2vw,18px)/1.1 var(--portfolio-font);
  letter-spacing:-.025em; white-space:nowrap;
  background:linear-gradient(105deg,#a01832 0%,#9a4300 20%,#716300 38%,#086b3b 55%,#1749ad 74%,#70218d 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  opacity:0; transform:translate(-3px,-50%); pointer-events:none;
  transition:opacity 240ms var(--ui-ease),transform 320ms var(--ui-ease);
}
@media (hover:hover) and (pointer:fine) {
  .site-nav .pride-flag::before { pointer-events:auto; }
  .site-nav .pride-flag:is(:hover,:focus-visible,.is-hovered) > img { opacity:0; transform:scale(.94); }
  .site-nav .pride-flag:is(:hover,:focus-visible,.is-hovered) > .pride-message { opacity:1; transform:translate(0,-50%); pointer-events:auto; }
}
@media (max-width:800px) {
  .site-nav { display:flex; opacity:0; visibility:hidden; transform:translateY(-6px); transition:opacity 220ms var(--ui-ease),transform 260ms var(--ui-ease),visibility 0s 260ms; }
  .site-nav.menu-open { opacity:1; visibility:visible; transform:translateY(0); transition-delay:0s; }
  .slide-toggle { opacity:1; }
  .mobile-header button { min-width:64px; min-height:44px; }
  .mobile-header { background:rgba(255,255,255,.96); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); border-bottom-color:rgba(0,0,0,.1); }
  .mobile-header button::after { content:"+"; display:inline-block; width:14px; margin-left:7px; color:#777; }
  .mobile-header button[aria-expanded="true"]::after { content:"−"; }
  .site-nav .page-content { padding-bottom:calc(28px + env(safe-area-inset-bottom))!important; }
  .site-nav .project-link { display:inline-block; min-height:40px; line-height:40px!important; }
  .slide-button { width:36px; height:36px; }
  .slide-counter { left:10px; bottom:12px; }
  .slide-toggle { right:10px; }
  .lightbox .close { top:calc(16px + env(safe-area-inset-top)); }
  .lightbox .counter { bottom:calc(18px + env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion:reduce) {
  .site-nav a,.site-nav .nav-title,.site-nav,.slide-button,.slide-toggle,.lightbox button { transition:none; }
}
