/* Content stays usable before, without, or after a failed animation startup. */
.portfolio-enhanced #preloader, .portfolio-fallback #preloader { display: none !important; }
#portfolio-static { display: none; }
.portfolio-fallback #portfolio-static { display: block; }
#ui { top: 0; left: 0; }
html.portfolio-fallback, html.portfolio-fallback body {
  height: auto; min-height: 100%; overflow: auto; overscroll-behavior: auto;
}
html:not(.portfolio-enhanced) #ui { visibility: hidden; pointer-events: none; }
.portfolio-fallback #canvas,
.portfolio-fallback #transition-overlay,
.portfolio-fallback #input-blocker { display: none !important; }
#header-menu-newsletter, #footer-middle-newsletter { display: none !important; }
:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
#portfolio-static {
  position: absolute; top: 0; left: 0; width: 100%; box-sizing: border-box;
  color: #19191b; background: #f3f3f7; font: 18px/1.55 Inter, Arial, sans-serif;
  letter-spacing: 0; padding: 24px max(20px, calc((100% - 1200px) / 2));
}
#portfolio-static[hidden] { display: none; }
#portfolio-static nav { display: flex; flex-wrap: wrap; gap: 24px; padding: 8px 0 32px; }
#portfolio-static a { color: inherit; text-decoration: underline; }
#portfolio-static h1 { font-size: 42px; line-height: 1.15; margin: 24px 0; max-width: 1000px; }
#portfolio-static h2 { font-size: 26px; line-height: 1.2; }
#portfolio-static p { max-width: 800px; margin: 20px 0; }
#portfolio-static img, #portfolio-static video { width: 100%; height: auto; display: block; }
#portfolio-static .static-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; margin: 32px 0; }
#portfolio-static .static-grid img { aspect-ratio: 16 / 10; object-fit: cover; }
#portfolio-static .static-grid a { text-decoration: none; }
#portfolio-static .static-grid h2 { margin: 12px 0 4px; }
#portfolio-static .static-grid p { font-size: 14px; margin: 0; }
#portfolio-static .static-gallery { display: grid; gap: 20px; margin: 32px 0; }
#portfolio-static footer { border-top: 1px solid #bbb; margin-top: 48px; padding: 24px 0; }
.project-enquiry { margin-top: 28px; font-size: 16px; line-height: 1.5; }
.project-enquiry a { text-decoration: underline; }
#home-hero-title { font-size: 28px; grid-column: 4 / span 5; }
#home-hero-contact { position: absolute; left: var(--base-padding-x); top: 110px; font-size: 16px; text-decoration: underline; z-index: 2; }
@media (max-width: 812px) {
  #portfolio-static h1 { font-size: 28px; }
  #portfolio-static .static-grid { grid-template-columns: 1fr; }
  #portfolio-static nav { gap: 16px; font-size: 16px; }
  #home-hero-title { font-size: 26px; grid-column: 1 / span 6; }
  #home-hero-contact { top: auto; bottom: 50px; padding: 10px; background: #f3f3f7; }
}