a,
button,
input,
textarea,
select {
   transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex="-1"]:focus-visible {
   outline: 3px solid var(--signal);
   outline-offset: 4px;
}

.toplinks a:hover,
.wordmark:hover {
   color: var(--forest);
}

.toplinks a:hover::after {
   background: var(--leaf);
}

.command-link:hover {
   border-color: var(--rust);
   color: var(--rust);
   background: transparent;
}

.tag-filter:hover,
.tag-filter.is-active {
   border-color: var(--forest-dark);
   color: var(--forest-dark);
   background: transparent;
}

.project-card__link:hover h2 {
   color: var(--rust);
}

.project-card__link:hover .project-cover {
   filter: saturate(1.08) contrast(1.03);
}

.project-card__link:hover .project-card__arrow,
.project-sequence a:hover span,
.text-link:hover,
.contact-register > a:hover {
   color: var(--rust);
}

.project-sequence a:hover,
.contact-register > a:hover {
   color: var(--forest);
   background: transparent;
}

.thumbnail:hover,
.thumbnail.is-active {
   border-color: var(--forest-dark);
}

/* The drafting grid is the shared drawing surface beneath transparent content. */
.site-header {
   box-shadow: none;
   backdrop-filter: none;
}

.wordmark__initials {
   box-shadow: none;
}

.page-shell {
   position: relative;
   z-index: 0;
   isolation: isolate;
}

.paper-transition {
   position: fixed;
   inset: 0;
   z-index: 100;
   visibility: hidden;
   overflow: hidden;
   color: var(--ink);
   background: var(--paper);
   pointer-events: none;
   contain: strict;
   opacity: 1;
}

.paper-transition.is-active {
   visibility: visible;
}

.paper-transition__viewport {
   position: absolute;
   inset: 0;
   border: 0;
   border-radius: 0;
   overflow: hidden;
   background-color: var(--paper);
   background-image:
      var(--paper-tonal-layers),
      linear-gradient(var(--grid-major) 1px, transparent 1px),
      linear-gradient(90deg, var(--grid-major) 1px, transparent 1px),
      linear-gradient(var(--grid-minor) 1px, transparent 1px),
      linear-gradient(90deg, var(--grid-minor) 1px, transparent 1px);
   background-position: center, center, center, 0 0, -1px -1px, -1px -1px, -1px -1px, -1px -1px;
   background-size: 100% 100%, 100% 100%, 100% 100%, 100% 100%, 120px 120px, 120px 120px, 24px 24px, 24px 24px;
   box-shadow: none;
   contain: strict;
}

.paper-world {
   position: absolute;
   top: 0;
   left: 0;
   width: 0;
   height: 0;
   transform-origin: 0 0;
   backface-visibility: hidden;
   will-change: transform;
}

.paper-world::before {
   content: "";
   position: absolute;
   top: var(--paper-world-top, -200vh);
   left: var(--paper-world-left, -200vw);
   width: var(--paper-world-width, 800vw);
   height: var(--paper-world-height, 400vh);
   background-color: var(--paper);
   background-image:
      var(--paper-tonal-layers),
      linear-gradient(var(--grid-major) 1px, transparent 1px),
      linear-gradient(90deg, var(--grid-major) 1px, transparent 1px),
      linear-gradient(var(--grid-minor) 1px, transparent 1px),
      linear-gradient(90deg, var(--grid-minor) 1px, transparent 1px);
   background-position: center, center, center, 0 0, -1px -1px, -1px -1px, -1px -1px, -1px -1px;
   background-size: 100% 100%, 100% 100%, 100% 100%, 100% 100%, 120px 120px, 120px 120px, 24px 24px, 24px 24px;
}

.paper-world::after {
   content: "";
   position: absolute;
   top: var(--paper-world-top, -200vh);
   left: var(--paper-world-left, -200vw);
   z-index: 90;
   width: var(--paper-world-width, 800vw);
   height: var(--paper-world-height, 400vh);
   background-image: url("../images/textures/drafting-paper-fiber-v2.webp");
   background-position: var(--paper-grain-position);
   background-size: 2048px 2048px;
   mix-blend-mode: multiply;
   opacity: 0.34;
   pointer-events: none;
}

.paper-world__section {
   position: absolute;
   top: 0;
   left: 0;
   overflow: hidden;
   color: var(--ink);
   background: transparent;
   transform-origin: center;
   backface-visibility: hidden;
   contain: layout paint style;
}

.paper-world__section:nth-child(3n + 1) {
   rotate: -0.018deg;
}

.paper-world__section:nth-child(3n + 2) {
   rotate: 0.014deg;
}

.paper-world__section:nth-child(3n) {
   rotate: -0.009deg;
}

.paper-world__section::before {
   content: "";
   position: absolute;
   top: 18px;
   left: 18px;
   z-index: 60;
   width: 28px;
   height: 28px;
   border-top: 1px solid var(--line-dark);
   border-left: 1px solid var(--line-dark);
   background: transparent;
}

.paper-world__header.site-header {
   position: absolute;
   top: 0;
   left: 50%;
   z-index: 50;
   width: min(var(--page-width), calc(100% - 48px));
   margin: 0;
   background-color: transparent;
   background-image: none;
   transform: translateX(-50%);
}

.paper-world__content {
   position: absolute;
   right: 0;
   left: 0;
   width: 100%;
   min-height: 100%;
   overflow: visible;
   backface-visibility: hidden;
}

.paper-world__content [data-ring-page],
.paper-world__content .site-footer {
   visibility: visible !important;
   opacity: 1 !important;
}

.paper-flight__model-poster {
   min-height: 280px;
   background-color: transparent;
   background-position: center;
   background-size: cover;
}

.paper-world__preview {
   position: relative;
   display: grid;
   width: min(var(--page-width), calc(100% - 48px));
   min-height: calc(100vh - var(--header-height));
   margin-inline: auto;
   grid-template-columns: minmax(0, 0.88fr) minmax(340px, 1.12fr);
   align-items: center;
   gap: clamp(44px, 7vw, 110px);
   padding: clamp(64px, 9vh, 120px) 0;
   border-bottom: 1px solid var(--line-dark);
}

.paper-world__preview-copy {
   position: relative;
   z-index: 2;
   min-width: 0;
}

.paper-world__preview-copy::before,
.paper-world__preview-copy::after {
   content: "";
   position: absolute;
   background: var(--line-dark);
}

.paper-world__preview-copy::before {
   top: -34px;
   left: 0;
   width: min(190px, 52%);
   height: 1px;
}

.paper-world__preview-copy::after {
   top: -48px;
   left: 18px;
   width: 1px;
   height: 30px;
}

.paper-world__preview-copy h2 {
   max-width: 760px;
   margin: 0;
   overflow-wrap: anywhere;
   font-size: clamp(3rem, 6.5vw, 6.8rem);
}

.paper-world__preview-image {
   width: 100%;
   max-height: 58vh;
   object-fit: contain;
   object-position: center;
   box-shadow: none;
}

.paper-transition__status {
   position: absolute;
   width: 1px;
   height: 1px;
   margin: -1px;
   padding: 0;
   border: 0;
   clip: rect(0 0 0 0);
   clip-path: inset(50%);
   overflow: hidden;
   white-space: nowrap;
}

html.is-paper-flying body > .site-header,
html.is-paper-flying body > [data-ring-page],
html.is-paper-flying body > .site-footer {
   visibility: hidden;
}

html.is-paper-flying,
html.is-paper-flying body {
   overscroll-behavior: none;
   overflow: hidden;
   overflow-anchor: none;
   scroll-behavior: auto;
}

@media (max-width: 760px) {
   .paper-world__header.site-header {
      width: min(var(--page-width), calc(100% - 28px));
   }

   .paper-world__preview {
      width: min(var(--page-width), calc(100% - 28px));
      min-height: calc(100vh - 112px);
      grid-template-rows: auto minmax(220px, 1fr);
      grid-template-columns: 1fr;
      align-content: center;
      gap: 32px;
      padding: 58px 0 36px;
   }

   .paper-world__preview-copy h2 {
      font-size: 3.15rem;
   }

   .paper-world__preview-image {
      width: 100%;
      max-height: 38vh;
   }
}