/* v1: Webflow IX2 remains authoritative for project hover / touch-scroll animations.
   Important: do not force .project-item-image opacity, z-index, or positioning here.
   Source Webflow JS has e-10 (desktop MOUSE_OVER) and e-379 (mobile SCROLLING_IN_VIEW).
 */
.rebuild-attachments {max-width:1300px;margin:0 auto;}
.rebuild-attachments iframe {display:block;max-width:100%;}
.rebuild-attachments img {max-width:100%;height:auto;}
/* Faithful desktop next-project link: Webflow's text and arrow classes, with
   a scoped layout and hover/focus animation for generated project pages. */
.rebuild-next-desktop.nav-link.next-button {
  position:relative;
  display:flex;
  align-items:center;
  width:max-content;
  max-width:calc(100% - 32px);
  min-height:48px;
  margin:30px 28px 45px auto;
  padding:6px 35px 6px 12px;
  background:transparent;
  color:#111;
  text-decoration:none;
  white-space:nowrap;
}
.rebuild-next-desktop .nav-link-text-3 {
  display:block;
  margin:0;
  padding:0;
  font-size:23px;
  font-weight:400;
  line-height:1.2;
}
.rebuild-next-desktop .nav-arrow-3 {
  position:absolute;
  top:calc(50% - 6px);right:3px;bottom:auto;left:auto;
  display:block;
  width:29px;height:16px;
  margin:0;padding:0;
  opacity:0;
  transform:translate(12px,-50%);
  transition:transform .25s ease,opacity .25s ease;
}
.rebuild-next-desktop:hover .nav-arrow-3,
.rebuild-next-desktop:focus-visible .nav-arrow-3 {
  opacity:1;
  transform:translate(0,-50%);
}
/* Keep the desktop navigation aligned to the project list at every desktop width.
   The original Webflow nav has fixed max widths plus +6px/-4px child offsets.
   Match the existing #work .container's breakpoints without changing its animations. */
@media screen and (min-width:992px) {
  .fixed-nav { --rebuild-project-edge:max(0px, calc((100vw - 1170px) / 2)); }
  .fixed-nav > .container-8.nav-container.w-container {
    box-sizing:border-box;
    width:100% !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:max(0px, calc(var(--rebuild-project-edge) - 6px)) !important;
    padding-right:max(0px, calc(var(--rebuild-project-edge) - 4px)) !important;
  }
}
@media screen and (min-width:1280px) {
  .fixed-nav { --rebuild-project-edge:max(0px, calc((100vw - 1280px) / 2)); }
}
@media screen and (min-width:1440px) {
  .fixed-nav { --rebuild-project-edge:64px; }
}
/* Match mobile achievement emphasis on desktop: names stay light, linked results are medium. */
@media (min-width:768px) {
  #about .paragraph-5[data-w-id="c88a4c62-f96d-77c3-aded-0b47de4f72e5"] a {
    font-weight:600 !important;
  }
}
/* Dedicated mobile CTA and balanced mobile media gutters. Desktop remains unchanged. */
.rebuild-next-mobile { display:none; }
@media (max-width:767px) {
  /* Award names remain light; linked achievements/results regain medium emphasis on mobile. */
  #about .paragraph-5[data-w-id="c88a4c62-f96d-77c3-aded-0b47de4f72e5"] a {
    font-weight:600 !important;
  }
  /* Original Webflow container reserves 20px at right. Restore the left gutter. */
  .casefilm .rebuild-attachments { margin-left:20px; margin-right:0; }
  .rebuild-next-desktop.nav-link.next-button { display:none; }
  .rebuild-next-mobile {
    display:block;
    width:max-content;
    max-width:calc(100% - 40px);
    margin:48px auto 48px;
    padding:6px 0;
    color:#111;
    font-size:16px;
    line-height:1.3;
    font-weight:400;
    text-align:center;
    text-decoration:none;
  }
}
@media (max-width:479px) {
  /* The original section adds 3px padding at the narrowest breakpoint. */
  .casefilm .rebuild-attachments { margin-left:17px; }
}
@media (prefers-reduced-motion: reduce){.rebuild-next-desktop .nav-arrow-3{transition:none;}}

.rebuild-media-image,.rebuild-media-pair{margin:2.5rem auto;width:100%;max-width:1300px;} .rebuild-media-image img{display:block;max-width:100%;height:auto;margin:auto;} .rebuild-media-pair>div{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;} .rebuild-media-pair img{width:100%;height:auto;object-fit:contain;} .media-caption{text-align:center;font-size:0.8rem;margin-top:0.6rem;} @media(max-width:599px){.rebuild-media-pair>div{grid-template-columns:1fr;gap:1rem;} .rebuild-media-image,.rebuild-media-pair{margin:1.5rem auto;}}