:root {
   --blueprint-line-ink: #111715;
}

.site-header,
.page-shell,
.site-footer {
   width: min(var(--page-width), calc(100% - 48px));
   margin-inline: auto;
}

/* 2026-09-01 consolidated drafting-sheet refinement */
.wordmark {
   gap: 14px;
}

.wordmark__mark {
   width: 42px;
   height: 50px;
   color: var(--forest);
   object-fit: contain;
}

.wordmark__initials {
   display: none;
}

.wordmark__name {
   color: var(--forest-dark);
   font-size: 1.28rem;
   letter-spacing: 0.08em;
   text-transform: uppercase;
}

.home-hero .draft-label {
   max-width: 540px;
   font-size: 0.88rem;
   line-height: 1.25;
}

.home-hero .draft-label::before {
   width: 48px;
   height: 24px;
   flex-basis: 48px;
   border-top-width: 2px;
   border-right-width: 2px;
}

.home-hero .hero-actions {
   min-height: 92px;
   margin-top: 38px;
}

.home-hero .command-link {
   min-width: min(100%, 336px);
   min-height: 64px;
   justify-content: space-between;
   border-bottom-width: 3px;
   font-family: var(--font-engineering);
   font-size: 1.5rem;
   text-transform: uppercase;
}

.featured-project__drawing::before,
.featured-project__drawing::after {
   display: none;
}

.projects-intro {
   display: block;
   padding-bottom: 40px;
}

.projects-intro h1 {
   margin-bottom: 12px;
}

.projects-intro__subtitle {
   margin: 0;
   color: var(--forest);
   font-family: var(--font-drafting);
   font-size: 1rem;
   letter-spacing: 0.12em;
}

.catalog-tools[data-project-catalog] {
   display: grid;
   grid-template-columns: 145px minmax(0, 1fr);
   gap: 24px;
   align-items: center;
   padding: 24px 0 38px;
   border-bottom: 0;
}

.catalog-tools__label {
   margin: 0;
   color: var(--forest);
   font-family: var(--font-drafting);
   font-size: 0.7rem;
   font-weight: 700;
}

.tag-filter-group {
   gap: 12px 22px;
}

.tag-filter {
   position: relative;
   min-height: 32px;
   padding: 0 0 4px;
   font-family: var(--font-drafting);
   font-size: 0.72rem;
   letter-spacing: 0.035em;
}

.tag-filter::before {
   content: "";
   position: absolute;
   bottom: -1px;
   left: 0;
   width: 0;
   height: 2px;
   background: var(--forest);
}

.tag-filter.is-active {
   color: var(--forest-dark);
   font-weight: 700;
}

.tag-filter.is-active::before {
   width: 100%;
}

.project-catalog {
   padding-bottom: 120px;
}

.project-group + .project-group {
   margin-top: 92px;
}

.project-group__title {
   position: relative;
   margin: 0 0 42px;
   padding: 18px 0 15px;
   border-top: 2px solid var(--forest-dark);
   border-bottom: 1px solid var(--line-dark);
   font-size: clamp(2rem, 3.4vw, 3.4rem);
}

.project-group__title::before,
.project-group__title::after {
   content: "";
   position: absolute;
   top: -8px;
   width: 1px;
   height: 16px;
   background: var(--forest-dark);
}

.project-group__title::before { left: 0; }
.project-group__title::after { right: 0; }

.project-group .work-grid {
   margin-bottom: 0;
}

.project-card {
   padding-top: 0;
   border-top: 0;
}

.project-card::before {
   display: none;
}

.project-card__link {
   border-top: 1px solid var(--line-dark);
}

.project-wireframe {
   position: relative;
   display: grid;
   min-height: 250px;
   aspect-ratio: 4 / 3;
   padding: 20px 8px 12px;
   place-items: center;
   overflow: hidden;
}

.project-wireframe::before,
.project-wireframe::after {
   content: "";
   position: absolute;
   top: -6px;
   width: 1px;
   height: 12px;
   background: var(--line-dark);
}

.project-wireframe::before { left: 0; }
.project-wireframe::after { right: 0; }

.project-wireframe img {
   width: 100%;
   height: 100%;
   object-fit: contain;
   filter: sepia(0.18) saturate(0.72) contrast(1.04);
   opacity: 0.86;
}

.project-wireframe--pending img {
   opacity: 0.42;
}

.project-title-block {
   display: grid;
   min-height: 116px;
   grid-template-columns: minmax(0, 1fr) 108px;
   margin: 0;
   border: 1px solid var(--forest-dark);
}

.project-title-block > div {
   display: grid;
   grid-template-columns: 82px minmax(0, 1fr);
   grid-column: 1 / -1;
   align-items: baseline;
   min-width: 0;
   padding: 8px 10px;
   border-bottom: 1px solid var(--line-dark);
}

.project-title-block > div:nth-child(2) {
   grid-column: 1;
   border-bottom: 0;
}

.project-title-block > div:nth-child(3) {
   grid-column: 2;
   grid-template-columns: 1fr;
   border-bottom: 0;
   border-left: 1px solid var(--line-dark);
}

.project-title-block dt,
.project-title-block dd {
   margin: 0;
   font-family: var(--font-drafting);
   line-height: 1.15;
}

.project-title-block dt {
   color: var(--ink-soft);
   font-size: 0.58rem;
   font-weight: 700;
}

.project-title-block dd {
   min-width: 0;
   color: var(--forest-dark);
   font-size: 0.82rem;
   overflow-wrap: anywhere;
   text-transform: uppercase;
}

.project-title-block > div:first-child dd {
   font-size: 1.06rem;
}

.project-title-block__name--literal,
body[data-current-page="squareness-comparator"] .title-block__sheet-name {
   text-transform: none;
}

.project-documentation-label {
   display: block;
   margin-top: 6px;
   color: var(--ink-strong);
   font-family: var(--font-drafting);
   font-size: 0.8rem;
   font-weight: 700;
   line-height: 1.35;
   letter-spacing: 0.025em;
}

.project-documentation-notice {
   margin: 0 0 32px;
   padding: 12px 0 12px 16px;
   border-left: 2px solid var(--line-dark);
   color: var(--ink);
   font-size: 0.95rem;
   line-height: 1.6;
}

[data-project-unavailable] {
   cursor: default;
}

[data-project-unavailable]:hover .scroll-drawing__svg {
   transform: none;
}

@media (min-width: 1041px) {
   .project-title-block {
      min-height: 122px;
   }

   .project-title-block > div {
      grid-template-columns: 88px minmax(0, 1fr);
      align-items: start;
      padding-block: 9px;
   }

   .project-title-block dt,
   .project-title-block dd {
      line-height: 1.3;
   }

   .project-title-block dt {
      font-size: 0.66rem;
   }

   .project-title-block dd {
      font-size: 0.86rem;
   }

   .project-title-block > div:first-child dd {
      font-size: 1.08rem;
   }
}

.site-footer[data-title-block] {
   position: relative;
   display: grid;
   width: min(1760px, calc(100% - 48px));
   min-height: 430px;
   grid-template-columns: minmax(320px, 0.9fr) minmax(455px, 1.18fr) minmax(375px, 1fr);
   align-items: end;
   gap: 0;
   padding: clamp(110px, 10vw, 170px) 0 34px;
   border-top: 0;
   border-bottom: 0;
   color: var(--forest-dark);
   font-family: var(--font-drafting);
   font-weight: 400;
   letter-spacing: 0.075em;
   line-height: 1.08;
   text-transform: uppercase;
}

.site-footer[data-title-block]::before {
   content: "";
   position: absolute;
   z-index: 1;
   right: 0;
   bottom: 32px;
   left: 0;
   height: 4px;
   background: var(--forest-dark);
   pointer-events: none;
}

.site-footer[data-title-block]::after {
   content: "";
   position: absolute;
   z-index: 1;
   top: 0;
   right: 0;
   bottom: 32px;
   width: 2px;
   background: var(--forest-dark);
   pointer-events: none;
}

body[data-current-page="home"] .site-footer[data-title-block] {
   min-height: 430px;
   align-items: end;
   padding-top: clamp(110px, 10vw, 170px);
}

.title-block__left,
.title-block__identity,
.title-block__sheet {
   min-width: 0;
   border-top: 2px solid var(--forest-dark);
   border-left: 2px solid var(--forest-dark);
}

.title-block__left {
   display: grid;
   min-height: 158px;
   grid-template-columns: 1fr 1.03fr;
}

.title-block__characteristics,
.title-block__notes {
   min-width: 0;
}

.title-block__characteristics table {
   width: 100%;
   height: 100%;
   border-collapse: collapse;
   table-layout: fixed;
}

.title-block__characteristics caption,
.title-block__notes h2 {
   height: 26px;
   margin: 0;
   padding: 7px 10px 5px;
   border-bottom: 1px solid var(--forest-dark);
   color: inherit;
   font: inherit;
   font-size: 0.53rem;
   font-weight: 700;
   letter-spacing: 0.1em;
   text-align: left;
   white-space: nowrap;
}

.title-block__characteristics th,
.title-block__characteristics td {
   height: 26px;
   padding: 4px 9px 3px;
   color: inherit;
   font-size: clamp(0.43rem, 0.43vw, 0.57rem);
   font-weight: 400;
   letter-spacing: 0.055em;
   line-height: 1;
   text-align: left;
   white-space: nowrap;
}

.title-block__characteristics td,
.title-block__notes {
   border-left: 1px solid var(--forest-dark);
}

.title-block__characteristics tr + tr th,
.title-block__characteristics tr + tr td {
   border-top: 1px solid var(--forest-dark);
}

.title-block__notes p {
   margin: 0;
   padding: 5px 12px 2px;
   font-size: clamp(0.48rem, 0.48vw, 0.62rem);
   letter-spacing: 0.06em;
   line-height: 1.12;
   white-space: nowrap;
}

.title-block__other-site {
   font-weight: 700;
   text-decoration: underline;
   text-underline-offset: 0.15em;
}

.title-block__notes .title-block__other-site-description {
   line-height: 1.35;
   text-transform: none;
   white-space: normal;
}

.title-block__identity {
   display: grid;
   min-height: 252px;
   grid-template-rows: minmax(138px, 1fr) 51px 61px;
   text-align: center;
}

.title-block__nameplate {
   display: grid;
   align-content: center;
   gap: 9px;
   min-width: 0;
   padding: 17px 20px 13px;
}

.title-block__nameplate strong {
   font-family: var(--font-engineering);
   font-size: clamp(2.15rem, 3.3vw, 4rem);
   font-weight: 400;
   letter-spacing: 0.16em;
   line-height: 0.92;
   white-space: nowrap;
}

.title-block__nameplate span {
   font-size: clamp(0.54rem, 0.58vw, 0.72rem);
   font-weight: 700;
   letter-spacing: 0.08em;
   white-space: nowrap;
}

.title-block__identity nav,
.title-block__social {
   display: grid;
   border-top: 1px solid var(--forest-dark);
}

.title-block__identity nav {
   grid-template-columns: repeat(4, 1fr);
}

.title-block__social {
   grid-template-columns: repeat(3, 1fr);
}

.title-block__identity a {
   display: flex;
   width: 100%;
   min-width: 0;
   align-items: center;
   justify-content: center;
   gap: 12px;
   padding: 8px 7px 6px;
   color: inherit;
   font-size: clamp(0.59rem, 0.64vw, 0.78rem);
   letter-spacing: 0.1em;
   line-height: 1;
   text-decoration: none;
}

.title-block__identity a + a {
   border-left: 1px solid var(--forest-dark);
}

.title-block__identity a:hover,
.title-block__identity a:focus-visible {
   opacity: 0.62;
}

.title-block__social svg {
   width: 23px;
   height: 23px;
   flex: 0 0 auto;
}

.title-block__social a:last-child svg {
   width: 27px;
}

.title-block__sheet {
   display: grid;
   min-height: 252px;
   grid-template-rows: 78px 76px 1fr;
   border-right: 2px solid var(--forest-dark);
}

.title-block__field-row {
   display: grid;
   min-width: 0;
}

.title-block__field-row + .title-block__field-row {
   border-top: 1px solid var(--forest-dark);
}

.title-block__field-row--top {
   grid-template-columns: 1fr 0.72fr 1.12fr 1.18fr;
}

.title-block__field-row--top > span:first-child {
   grid-column: 3;
   border-left: 1px solid var(--forest-dark);
}

.title-block__field-row--top > span:last-child {
   grid-column: 4;
}

.title-block__field-row--middle {
   grid-template-columns: 2.25fr 1fr;
}

.title-block__field-row--bottom {
   grid-template-columns: 0.58fr 2.67fr;
}

.title-block__field-row > span {
   display: flex;
   min-width: 0;
   flex-direction: column;
   justify-content: flex-start;
   gap: 9px;
   padding: 10px 11px 7px;
}

.title-block__field-row > span + span {
   border-left: 1px solid var(--forest-dark);
}

.title-block__field-row small {
   font-size: clamp(0.45rem, 0.44vw, 0.57rem);
   font-weight: 700;
   letter-spacing: 0.12em;
   line-height: 1;
   white-space: nowrap;
}

.title-block__field-row strong {
   min-width: 0;
   font-size: clamp(0.69rem, 0.72vw, 0.94rem);
   font-weight: 400;
   letter-spacing: 0.09em;
   line-height: 0.98;
   overflow-wrap: anywhere;
}

.title-block__field-row--middle strong,
.title-block__field-row--bottom strong {
   font-size: clamp(0.82rem, 0.9vw, 1.14rem);
}

.title-block__copyright {
   align-items: center;
   font-size: clamp(0.7rem, 0.8vw, 1rem);
   letter-spacing: 0.1em;
   white-space: nowrap;
}

.title-block__termination {
   position: absolute;
   z-index: 2;
   right: -9px;
   bottom: 13px;
   width: 18px;
   height: 42px;
   fill: var(--forest-dark);
   stroke: var(--forest-dark);
   stroke-linecap: square;
   stroke-linejoin: miter;
   stroke-width: 1.15;
   overflow: visible;
   pointer-events: none;
}

.catalog-loading,
.catalog-error {
   padding: 60px 0;
   border-top: 1px solid var(--line-dark);
   color: var(--ink-soft);
   font-family: var(--font-drafting);
}

/* Compact desktop title block: keep the drawing register and identity on a
   full-width row, then give Working Characteristics and Notes two clean,
   equally sized columns below. The extra body specificity intentionally
   carries this breakpoint through the late drafting-refinement stylesheet. */
@media (min-width: 1101px) and (max-width: 1399px) {
   html body .site-footer[data-title-block] {
      min-height: 0;
      grid-template-columns: minmax(0, 0.93fr) minmax(0, 1.07fr);
      padding-top: 110px;
   }

   html body[data-current-page="home"] .site-footer[data-title-block] {
      min-height: 0;
      padding-top: 110px;
   }

   html body .title-block__sheet,
   html body .title-block__identity {
      height: 264px;
      min-height: 264px;
      align-self: end;
   }

   html body .title-block__sheet {
      grid-column: 1;
      grid-row: 1;
      grid-template-rows: 70px 72px 120px;
   }

   html body .title-block__identity {
      grid-column: 2;
      grid-row: 1;
      grid-template-rows: 118px 72px 72px;
   }

   html body .title-block__identity::after {
      display: none;
   }

   html body .title-block__left {
      grid-column: 1 / -1;
      grid-row: 2;
      height: 288px;
      min-height: 288px;
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
      border-right: 2px solid var(--forest-dark);
   }

   html body .title-block__characteristics table {
      height: 240px;
   }

   html body .title-block__characteristics tr:last-child th,
   html body .title-block__characteristics tr:last-child td {
      height: 48px;
   }

   html body .title-block__nameplate strong {
      font-size: clamp(2.7rem, 4vw, 3.2rem);
      letter-spacing: 0.13em;
      transform: none;
   }

   html body .title-block__nameplate span {
      max-width: 92%;
      line-height: 1.2;
      white-space: normal;
      transform: none;
   }

   html body .title-block__field-row > span {
      gap: 6px;
      padding: 8px 10px 6px;
   }

   html body .title-block__field-row--middle {
      grid-template-columns: minmax(145px, 0.8fr) minmax(0, 2.2fr);
   }

   html body .title-block__field-row strong {
      overflow-wrap: normal;
      word-break: normal;
   }

   html body .title-block__sheet-name {
      width: 100%;
      font-size: 1.2rem;
      line-height: 1.08;
      hyphens: auto;
   }
}

/* Keep the approved three-column desktop composition while allocating the
   drawing-information row to the value that varies most: SHEET. */
@media (min-width: 1400px) {
   html body .title-block__field-row--middle {
      grid-template-columns: minmax(125px, 0.82fr) minmax(0, 2.18fr);
   }

   html body .title-block__sheet-name {
      width: 100%;
      font-size: 1.2rem;
      line-height: 1.08;
      overflow-wrap: normal;
      word-break: normal;
      hyphens: auto;
   }
}

@media (max-width: 1100px) {
   .site-footer[data-title-block] {
      min-height: 0;
      grid-template-columns: 1fr 1fr;
      padding-top: 90px;
   }

   body[data-current-page="home"] .site-footer[data-title-block] {
      min-height: 0;
      padding-top: 90px;
   }

   .title-block__identity {
      grid-column: 1;
      grid-row: 1;
      border-bottom: 2px solid var(--forest-dark);
   }

   .title-block__sheet {
      grid-column: 2;
      grid-row: 1;
      border-bottom: 2px solid var(--forest-dark);
   }

   .title-block__left {
      grid-column: 1 / -1;
      grid-row: 2;
      border-right: 2px solid var(--forest-dark);
   }

   .title-block__nameplate strong {
      font-size: clamp(2.1rem, 5.4vw, 3.6rem);
   }
}

@media (max-width: 720px) {
   .wordmark__mark {
      width: 34px;
      height: 40px;
   }

   .wordmark__name {
      font-size: 0.92rem;
   }

   .catalog-tools[data-project-catalog] {
      grid-template-columns: 1fr;
   }

   .project-title-block {
      grid-template-columns: 1fr 96px;
   }

   .site-footer[data-title-block] {
      grid-template-columns: 1fr;
      width: min(100% - 28px, 680px);
      padding-top: 64px;
   }

   body[data-current-page="home"] .site-footer[data-title-block] {
      padding-top: 64px;
   }

   .title-block__identity,
   .title-block__sheet,
   .title-block__left {
      grid-column: 1;
      min-width: 0;
      border-right: 2px solid var(--forest-dark);
   }

   .title-block__identity {
      min-height: 224px;
      grid-row: 1;
      grid-template-rows: minmax(122px, 1fr) 47px 55px;
   }

   .title-block__sheet {
      min-height: 230px;
      grid-row: 2;
   }

   .title-block__left {
      min-height: 158px;
      grid-row: 3;
   }

   .title-block__nameplate {
      padding-inline: 12px;
   }

   .title-block__nameplate strong {
      font-size: clamp(2rem, 9vw, 3.15rem);
      letter-spacing: 0.11em;
   }

   .title-block__nameplate span {
      font-size: clamp(0.47rem, 1.7vw, 0.63rem);
      white-space: normal;
   }

   .title-block__identity a {
      gap: 7px;
      font-size: clamp(0.52rem, 1.7vw, 0.69rem);
   }

   .title-block__social svg {
      width: 19px;
      height: 19px;
   }

   .title-block__social a:last-child svg {
      width: 23px;
   }

   .title-block__field-row strong {
      font-size: clamp(0.62rem, 2vw, 0.85rem);
   }

   .title-block__field-row--middle strong,
   .title-block__field-row--bottom strong {
      font-size: clamp(0.74rem, 2.4vw, 1rem);
   }
}

.site-header {
   position: relative;
   z-index: 50;
   display: flex;
   min-height: var(--header-height);
   align-items: center;
   justify-content: space-between;
   gap: 30px;
   border-bottom: 1px solid var(--line-dark);
   background: transparent;
}

.wordmark {
   display: inline-flex;
   min-width: max-content;
   align-items: center;
   gap: 12px;
}

.wordmark__initials {
   min-width: 34px;
   padding-right: 12px;
   border-right: 1px solid var(--line-dark);
   color: var(--forest);
   background: transparent;
   font-family: var(--font-drafting);
   font-size: 0.83rem;
   font-weight: 700;
}

.wordmark__name {
   font-family: var(--font-engineering);
   font-size: 1.15rem;
   font-weight: 400;
}

.toplinks {
   display: grid;
   grid-template-columns: repeat(4, minmax(86px, 1fr));
   width: min(520px, 100%);
   min-width: 0;
   align-self: stretch;
   align-items: stretch;
}

.toplinks a {
   position: relative;
   display: grid;
   min-width: 0;
   padding: 0 14px;
   place-items: center;
   color: var(--ink-soft);
   font-family: var(--font-drafting);
   font-size: 0.92rem;
}

.toplinks a::after {
   content: "";
   position: absolute;
   right: 14px;
   bottom: -1px;
   left: 14px;
   height: 4px;
   background: transparent;
}

.toplinks a[aria-current="page"] {
   color: var(--forest-dark);
   font-weight: 700;
}

.toplinks a[aria-current="page"]::after {
   background: var(--forest);
}

.page-shell {
   min-height: calc(100vh - var(--header-height));
   outline: none;
}

.home-hero {
   position: relative;
   display: grid;
   min-height: min(82svh, 760px);
   grid-template-columns: minmax(390px, 0.88fr) minmax(480px, 1.12fr);
   align-items: center;
   gap: clamp(40px, 4vw, 64px);
   padding: 78px 0 82px;
}

.hero-copy {
   position: relative;
   z-index: 2;
   min-width: 0;
   max-width: 690px;
}

.draft-label {
   display: flex;
   align-items: center;
   gap: 10px;
   margin-bottom: 18px;
   color: var(--forest);
   font-family: var(--font-drafting);
   font-size: 0.72rem;
   font-weight: 700;
   letter-spacing: 0;
   text-transform: uppercase;
}

.draft-label::before {
   content: "";
   width: 30px;
   height: 7px;
   flex: 0 0 30px;
   border-top: 1px solid var(--forest);
   border-right: 1px solid var(--forest);
}

.hero-copy h1 {
   max-width: 760px;
   margin-bottom: 40px;
   font-size: 5.2rem;
}

.hero-summary {
   max-width: 660px;
   margin-bottom: 0;
   color: var(--ink-soft);
   font-size: 1.22rem;
   line-height: 1.55;
}

.hero-actions {
   display: flex;
   margin-top: 34px;
   align-items: center;
   gap: 20px;
}

.command-link {
   display: inline-flex;
   min-height: 42px;
   align-items: center;
   justify-content: center;
   gap: 24px;
   padding: 0;
   border: 0;
   border-bottom: 1px solid var(--forest-dark);
   color: var(--forest-dark);
   background: transparent;
   font-weight: 700;
}

.command-link span {
   font-family: var(--font-drafting);
}

.hero-note {
   max-width: 220px;
   color: var(--ink-soft);
   font-size: 0.86rem;
   font-style: italic;
}

/* Homepage technical drawing: size/position and printed line treatment. */
.hero-drawing {
   position: relative;
   z-index: 1;
   width: 100%;
   max-width: 760px;
   margin: 0;
   justify-self: end;
}

.technical-drawing-link {
   display: block;
   width: 100%;
}

.scroll-drawing__svg {
   position: relative;
   z-index: 1;
   display: block;
   width: 100%;
   aspect-ratio: 1121.812 / 741.57052;
   border: 0;
   background: transparent;
   opacity: 0;
   overflow: visible;
   transition: opacity 220ms ease;
   pointer-events: none;
}

.scroll-drawing__svg.is-drawing-ready {
   opacity: 0.82;
}

/* A compact paper-colored separation halo sits behind the existing graphite
   pixels. It is applied to the rendered object only: source SVG strokes,
   paths, animation, viewBoxes, and geometry remain untouched. */
.hero-drawing .scroll-drawing__svg,
.featured-project__drawing .scroll-drawing__svg,
.about-v2__inline-drawing .scroll-drawing__svg,
.contact-drawing .scroll-drawing__svg {
   filter:
      drop-shadow(0 0 0.55px rgba(var(--paper-rgb), 0.96))
      drop-shadow(0 0 0.55px rgba(var(--paper-rgb), 0.72));
}

.blueprint-pigment {
   --pigment-image: none;
   --pigment-position: center;
   --pigment-size: contain;
   --pigment-grid-x: -1px;
   --pigment-grid-y: -1px;
   position: absolute;
   inset: 0;
   z-index: 0;
   background-image: var(--pigment-image);
   background-position: var(--pigment-position);
   background-repeat: no-repeat;
   background-size: var(--pigment-size);
   pointer-events: none;
}

/* Lighten the original irregular pigment without flattening its grain or
   changing the fixed drafting grid drawn by ::after. */
.blueprint-pigment::before {
   content: "";
   position: absolute;
   inset: 0;
   background: rgba(var(--paper-rgb), 0.13);
   -webkit-mask-image: var(--pigment-image);
   -webkit-mask-position: var(--pigment-position);
   -webkit-mask-repeat: no-repeat;
   -webkit-mask-size: var(--pigment-size);
   mask-image: var(--pigment-image);
   mask-position: var(--pigment-position);
   mask-repeat: no-repeat;
   mask-size: var(--pigment-size);
   pointer-events: none;
}

.blueprint-pigment::after {
   content: "";
   position: absolute;
   inset: 0;
   background-image:
      linear-gradient(rgba(var(--paper-rgb), 0.74) 1px, transparent 1px),
      linear-gradient(90deg, rgba(var(--paper-rgb), 0.74) 1px, transparent 1px),
      linear-gradient(rgba(var(--paper-rgb), 0.42) 1px, transparent 1px),
      linear-gradient(90deg, rgba(var(--paper-rgb), 0.42) 1px, transparent 1px);
   background-position:
      var(--pigment-grid-x) var(--pigment-grid-y),
      var(--pigment-grid-x) var(--pigment-grid-y),
      var(--pigment-grid-x) var(--pigment-grid-y),
      var(--pigment-grid-x) var(--pigment-grid-y);
   background-size: 120px 120px, 120px 120px, 24px 24px, 24px 24px;
   -webkit-mask-image: var(--pigment-image);
   -webkit-mask-position: var(--pigment-position);
   -webkit-mask-repeat: no-repeat;
   -webkit-mask-size: var(--pigment-size);
   mask-image: var(--pigment-image);
   mask-position: var(--pigment-position);
   mask-repeat: no-repeat;
   mask-size: var(--pigment-size);
   pointer-events: none;
}

.blueprint-pigment--campad {
   --pigment-image: url("../projects/campad/drawings/campad-blueprint-wash.webp?v=20260903-campad-smaller");
}

.blueprint-pigment--rock-polisher {
   --pigment-image: url("../projects/rock-polisher/drawings/rock-polisher-blueprint-wash.webp?v=20260902-blueprint-v2");
}

.blueprint-pigment--plasma-table {
   --pigment-image: url("../projects/plasma-table-v5/drawings/plasma-table-v5-blueprint-wash.webp?v=20260903-plasma-organic");
}

.blueprint-pigment--mini-vise {
   --pigment-image: url("../projects/miniature-toolmakers-vise/drawings/miniature-toolmakers-vise-blueprint-wash.webp?v=20260902-blueprint-v2");
}

.blueprint-pigment--knife-02 {
   --pigment-image: url("../projects/knife-2/drawings/knife-2-blueprint-wash.webp?v=20260903-generated-knife-washes");
}

.blueprint-pigment--knife-07 {
   --pigment-image: url("../projects/knife-7/drawings/knife-7-blueprint-wash.webp?v=20260903-generated-knife-washes");
}

.blueprint-pigment--engraving-mill-v2 {
   --pigment-image: url("../projects/engraving-mill-v2/drawings/engraving-mill-v2-blueprint-wash.webp?v=20260902-blueprint-v2");
}

.blueprint-pigment--ford-ranger-flatbed {
   --pigment-image: url("../projects/ford-ranger-flatbed/drawings/ford-ranger-flatbed-blueprint-wash.webp?v=20260902-blueprint-v2");
}

.blueprint-pigment--squareness-comparator {
   --pigment-image: url("../projects/squareness-comparator/drawings/squareness-comparator-blueprint-wash.webp?v=20260902-blueprint-v2");
}

.about-v2__inline-drawing .blueprint-pigment,
.contact-drawing .blueprint-pigment {
   bottom: 30px;
}

.about-v2__knife-vertical .blueprint-pigment {
   inset: 0 0 30px;
}

/* Enlarge the pigment boxes without transforming them. Their ::after grid
   therefore stays at the original 24px / 120px scale and remains aligned to
   the site-wide drafting grid. */
.hero-drawing .blueprint-pigment {
   inset: -55px -80px;
}

.featured-project--drawing-left .blueprint-pigment {
   top: -144px;
   right: -173px;
   bottom: -134px;
   left: -95px;
   transform: translateX(-125px);
}

.featured-project--drawing-right .blueprint-pigment {
   top: -130px;
   right: -75px;
   bottom: -100px;
   left: -145px;
   transform: translateX(50px);
}

.about-v2__background-drawing .blueprint-pigment,
.about-v2__outside-drawing .blueprint-pigment {
   top: -40px;
   right: -60px;
   bottom: -10px;
   left: -60px;
}

.about-v2__outside-drawing .blueprint-pigment--knife-07 {
   right: -84px;
   left: -84px;
}

.about-v2__knife-vertical .blueprint-pigment {
   top: -30px;
   right: -30px;
   bottom: -12px;
   left: -30px;
}

@media (min-width: 761px) {
   .about-v2__knife-vertical .blueprint-pigment--knife-02 {
      /* Fill the remaining annotated space with pigment only. Compensate for
         the small upward expansion so its drafting grid stays registered. */
      top: -35px;
      right: -50px;
      bottom: -26px;
      --pigment-grid-y: 4px;
   }
}

@supports (-moz-appearance: none) {
   .about-v2__knife-vertical .blueprint-pigment--knife-02 {
      transform: translateX(8px);
   }

   .about-v2__outside-drawing .blueprint-pigment--knife-07 {
      top: -64px;
      bottom: 14px;
   }
}

.contact-drawing .blueprint-pigment {
   top: -40px;
   right: -55px;
   bottom: -30px;
   left: -55px;
}

:is(
   .hero-drawing,
   .featured-project__drawing,
   .about-v2__inline-drawing,
   .contact-drawing
) .blueprint-pigment {
   --pigment-size: 100% 100%;
}

.hero-drawing .blueprint-pigment--campad {
   --pigment-size: 108% 110%;
}

/* The supplied Flatbed view reaches farther right than the placeholder this
   wash was originally sized around. Enlarge the existing mask inside its
   established box so the edge texture expands without widening the page. */
.contact-drawing .blueprint-pigment--ford-ranger-flatbed {
   --pigment-size: 116% 112%;
   --pigment-position: 52% 50%;
   transform: scaleX(-1);
   transform-origin: center;
}

.hero-drawing .scroll-drawing__svg {
   transform: scale(1.033);
   transform-origin: center;
}

.featured-project__drawing .blueprint-pigment {
   bottom: 48px;
}

.featured-project.featured-project--drawing-left .blueprint-pigment {
   bottom: -134px;
}

.featured-project.featured-project--drawing-right .blueprint-pigment {
   bottom: -100px;
}

/* Keep the approved plasma drawing scale while giving the wash enough horizontal
   mask-box room for every textured edge to remain visible instead of clipping. */
.featured-project .blueprint-pigment--plasma-table {
   right: max(
      calc(var(--draft-frame-left, 0px) + var(--draft-frame-width, 100vw) - 100vw),
      -80px
   );
   left: -138px;
   --pigment-size: 112% 88%;
   transform: none;
}

.featured-project--drawing-left .scroll-drawing__svg {
   transform: translateX(calc(5.35% - 125px)) scale(1.323);
   transform-origin: center;
}

.featured-project--drawing-right .scroll-drawing__svg {
   transform: translateX(calc(-4% + 20px)) scale(1.047);
   transform-origin: center;
}

.contact-drawing .scroll-drawing__svg {
   transform: scale(1.134);
   transform-origin: center;
}

.hero-drawing figcaption {
   position: absolute;
   right: 2.5%;
   bottom: -18px;
   margin: 0;
   padding-top: 5px;
   border-top: 1px solid rgba(32, 75, 56, 0.58);
   color: var(--forest);
   font-family: var(--font-drafting);
   font-size: 0.8rem;
   line-height: 1.1;
}

.technical-drawing-link:hover .scroll-drawing__svg,
.featured-project__drawing:hover .scroll-drawing__svg {
   opacity: 1;
}

.featured-project {
   position: relative;
   display: grid;
   min-height: clamp(920px, 110svh, 1080px);
   grid-template-columns: minmax(0, 1.12fr) minmax(360px, 0.88fr);
   gap: clamp(54px, 7vw, 112px);
   align-items: center;
   padding: clamp(84px, 10vh, 128px) 0;
   border-top: 1px solid var(--line-dark);
}

.featured-project::before,
.featured-project::after {
   content: "";
   position: absolute;
   top: -6px;
   width: 1px;
   height: 12px;
   background: var(--line-dark);
}

.featured-project::before {
   left: 0;
}

.featured-project::after {
   right: 0;
}

.featured-project--drawing-right {
   grid-template-columns: minmax(360px, 0.88fr) minmax(0, 1.12fr);
}

.featured-project__drawing {
   position: relative;
   display: grid;
   width: 100%;
   height: clamp(560px, 70svh, 720px);
   min-width: 0;
   place-items: center;
}

.featured-project__drawing::before,
.featured-project__drawing::after {
   content: "";
   position: absolute;
   z-index: 2;
   background: rgba(32, 75, 56, 0.35);
   pointer-events: none;
}

.featured-project__drawing::before {
   right: 4%;
   bottom: 9%;
   left: 4%;
   height: 1px;
}

.featured-project__drawing::after {
   top: 5%;
   bottom: 5%;
   left: 50%;
   width: 1px;
}

.featured-project__drawing .scroll-drawing__svg {
   position: absolute;
   inset: 0;
   width: 100%;
   height: 100%;
   aspect-ratio: auto;
}

.featured-project__caption {
   position: absolute;
   z-index: 3;
   right: 4%;
   bottom: -140px;
   padding-top: 6px;
   border-top: 1px solid rgba(32, 75, 56, 0.58);
   color: var(--forest);
   font-family: var(--font-drafting);
   font-size: 0.8rem;
   line-height: 1.1;
}

@media (min-width: 1041px) {
   body[data-current-page="home"]
   #from-idea-to-working-part
   .featured-project__caption {
      right: calc(4% - 67px);
      bottom: 8px;
   }
}

.featured-project__copy {
   position: relative;
   min-width: 0;
   padding-top: 34px;
   border-top: 1px solid var(--forest-dark);
}

.featured-project__copy::before {
   content: "";
   position: absolute;
   top: -12px;
   left: 0;
   width: 1px;
   height: 24px;
   background: var(--forest-dark);
}

.featured-project__copy h2 {
   margin-bottom: 30px;
   font-size: clamp(3.2rem, 5vw, 5.6rem);
}

.featured-project__copy h2 a:hover {
   color: var(--rust);
}

.featured-project__copy > p:not(.draft-label) {
   max-width: 560px;
   margin-bottom: 0;
   color: var(--ink-soft);
   font-size: 1.12rem;
   line-height: 1.65;
}

.featured-project__copy .command-link {
   margin-top: 34px;
}

.home-register {
   padding: 72px 0 112px;
   border-top: 1px solid var(--line-dark);
}

.section-heading {
   display: grid;
   grid-template-columns: 1fr 2fr;
   gap: 30px;
   align-items: end;
   margin-bottom: 36px;
}

.section-heading .draft-label {
   margin-bottom: 5px;
}

.section-heading h2 {
   margin-bottom: 0;
   font-size: 3.6rem;
}

.project-register {
   margin: 0;
   padding: 0;
   border-top: 2px solid var(--forest-dark);
   list-style: none;
}

.project-register li {
   min-height: 112px;
   border-bottom: 1px solid var(--line-dark);
}

.project-register a {
   display: grid;
   min-height: 112px;
   grid-template-columns: 1fr auto;
   gap: 22px;
   align-items: center;
}

.project-register p {
   margin-bottom: 4px;
   color: var(--ink-soft);
   font-size: 0.85rem;
   font-style: italic;
}

.project-register h3 {
   margin-bottom: 0;
   font-size: 1.65rem;
}

.register-status {
   color: var(--ink-soft);
   font-family: var(--font-drafting);
   font-size: 0.68rem;
   text-transform: uppercase;
}

.site-footer {
   display: flex;
   min-height: 104px;
   align-items: center;
   justify-content: space-between;
   gap: 24px;
   padding-bottom: 34px;
   border-top: 1px solid var(--line-dark);
   color: var(--ink-soft);
   font-size: 0.85rem;
}

.site-footer p {
   margin-bottom: 0;
}

body[data-current-page="home"] .site-footer {
   min-height: clamp(320px, 36vh, 460px);
   align-items: flex-start;
   padding-top: 28px;
}

.page-intro {
   display: grid;
   grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.75fr);
   gap: 64px;
   align-items: end;
   padding: 86px 0 58px;
   border-bottom: 1px solid var(--line-dark);
}

.page-intro h1,
.about-lead h1,
.contact-hero h1,
.project-masthead h1 {
   margin-bottom: 0;
   font-size: 4.8rem;
}

.page-intro > p,
.contact-hero > p,
.project-lede {
   margin-bottom: 4px;
   color: var(--ink-soft);
   font-size: 1.1rem;
}

.catalog-tools {
   display: grid;
   grid-template-columns: minmax(250px, 360px) 1fr auto;
   gap: 20px;
   align-items: end;
   padding: 30px 0;
   border-bottom: 1px solid var(--line);
}

.catalog-search {
   display: grid;
   gap: 8px;
}

.catalog-search > span {
   color: var(--ink-soft);
   font-family: var(--font-drafting);
   font-size: 0.68rem;
   font-weight: 700;
   text-transform: uppercase;
}

.catalog-search input {
   min-height: 44px;
   width: 100%;
   padding: 0;
   border: 0;
   border-bottom: 1px solid var(--line-dark);
   border-radius: 0;
   background: transparent;
}

.tag-filter-group,
.tags {
   display: flex;
   flex-wrap: wrap;
   gap: 7px;
   margin: 0;
   padding: 0;
   list-style: none;
}

.tag-filter {
   min-height: 34px;
   padding: 0 2px;
   border: 0;
   border-bottom: 1px solid transparent;
   border-radius: 0;
   color: var(--ink-soft);
   background: transparent;
   font-size: 0.78rem;
}

.catalog-count {
   margin: 0 0 9px;
   color: var(--ink-soft);
   font-family: var(--font-drafting);
   font-size: 0.68rem;
   white-space: nowrap;
   text-transform: uppercase;
}

.work-grid {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 58px 32px;
   margin-bottom: 104px;
   background: transparent;
}

.project-card {
   position: relative;
   min-width: 0;
   padding-top: 14px;
   border-top: 1px solid var(--line-dark);
   background: transparent;
}

.project-card::before {
   content: "";
   position: absolute;
   top: -6px;
   left: 0;
   width: 1px;
   height: 12px;
   background: var(--line-dark);
}

.project-card__link {
   position: relative;
   display: flex;
   height: 100%;
   min-height: 0;
   flex-direction: column;
}

.project-cover {
   position: relative;
   display: grid;
   min-height: 260px;
   aspect-ratio: 4 / 3;
   place-items: center;
   background: transparent;
   overflow: hidden;
}

.cover-axis {
   position: absolute;
   top: 50%;
   right: 9%;
   left: 9%;
   height: 1px;
   background: var(--forest);
}

.cover-axis::after {
   content: "";
   position: absolute;
   top: -112px;
   left: 50%;
   width: 1px;
   height: 224px;
   background: var(--forest);
}

.cover-shape {
   position: relative;
   z-index: 1;
}

.project-cover--cnc .cover-shape {
   width: 178px;
   height: 154px;
   border: 11px solid var(--forest);
   box-shadow: inset 0 -36px 0 #dce8dc, inset 0 -38px 0 var(--forest);
}

.project-cover--cnc .cover-shape::before {
   content: "";
   position: absolute;
   top: 25px;
   left: 50%;
   width: 38px;
   height: 64px;
   border: 4px solid var(--rust);
   transform: translateX(-50%);
}

.project-cover--keyboard .cover-shape {
   width: 220px;
   height: 104px;
   border: 7px solid var(--blue);
   background-image: repeating-linear-gradient(90deg, transparent 0 18px, var(--blue) 18px 20px);
   box-shadow: inset 0 19px 0 transparent, inset 0 21px 0 var(--blue), inset 0 42px 0 transparent, inset 0 44px 0 var(--blue), inset 0 65px 0 transparent, inset 0 67px 0 var(--blue);
}

.project-cover--generic .cover-shape {
   display: grid;
   width: 166px;
   height: 166px;
   place-items: center;
   border: 7px solid var(--forest);
   color: var(--forest);
   background: transparent;
   font-family: var(--font-drafting);
   font-size: 1.5rem;
   font-weight: 700;
}

.project-cover--image {
   background: transparent;
}

.project-cover--image::after {
   content: "";
   position: absolute;
   inset: 0;
   background: rgba(13, 42, 32, 0.03);
   pointer-events: none;
}

.project-cover--image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}

.cover-code {
   position: absolute;
   right: 12px;
   bottom: 10px;
   z-index: 2;
   padding: 3px 0;
   border-top: 1px solid var(--forest-dark);
   color: var(--forest-dark);
   background: transparent;
   font-family: var(--font-drafting);
   font-size: 0.58rem;
   font-weight: 700;
}

.project-card__copy {
   position: relative;
   display: flex;
   flex: 1;
   flex-direction: column;
   padding: 22px 0 0;
}

.project-card__number {
   position: absolute;
   top: 21px;
   right: 0;
   color: var(--forest);
   font-family: var(--font-drafting);
   font-size: 0.7rem;
   font-weight: 700;
}

.project-type {
   margin-bottom: 12px;
   color: var(--rust);
   font-size: 0.84rem;
   font-style: italic;
}

.project-card h2 {
   max-width: calc(100% - 32px);
   margin-bottom: 16px;
   font-size: 2rem;
}

.project-card__copy > p:not(.project-type) {
   color: var(--ink-soft);
}

.project-card .tags {
   margin-top: auto;
   padding-top: 22px;
}

.tags li {
   position: relative;
   padding: 0;
   border: 0;
   color: var(--ink-soft);
   font-family: var(--font-drafting);
   font-size: 0.62rem;
   text-transform: uppercase;
}

.tags li + li::before {
   content: "/";
   margin-right: 7px;
   color: var(--line-dark);
}

.project-card__arrow {
   display: block;
   margin-top: 22px;
   color: var(--forest);
   font-family: var(--font-drafting);
   font-size: 1.15rem;
}

.project-masthead {
   display: grid;
   grid-template-columns: minmax(0, 1.2fr) minmax(310px, 0.8fr);
   gap: 70px;
   align-items: end;
   padding: 86px 0 48px;
}

.project-masthead--files {
   min-height: min(42svh, 440px);
   grid-template-columns: minmax(0, 1fr);
   align-items: end;
}

.project-masthead--files h1 {
   max-width: 1050px;
}

.project-masthead--case-study {
   min-height: min(66svh, 690px);
   border-bottom: 1px solid var(--line-dark);
}

.project-masthead__summary {
   max-width: 620px;
   padding-bottom: 12px;
}

.project-masthead__summary p {
   color: var(--ink-soft);
   font-size: 1.02rem;
}

.project-masthead__summary .project-subtitle {
   margin-bottom: 20px;
   color: var(--ink-strong);
   font-family: var(--font-drafting);
   font-size: 1.35rem;
   font-weight: 700;
   line-height: 1.35;
}

.project-facts {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
   border-top: 1px solid var(--line-dark);
   border-bottom: 1px solid var(--line-dark);
}

.project-facts div {
   min-width: 0;
   padding: 15px 18px;
   border-right: 1px solid var(--line);
}

.project-facts div:last-child {
   border-right: 0;
}

.project-facts span,
.project-specs dt {
   display: block;
   margin-bottom: 5px;
   color: var(--ink-soft);
   font-family: var(--font-drafting);
   font-size: 0.62rem;
   font-weight: 700;
   text-transform: uppercase;
}

.project-facts strong {
   display: block;
   overflow-wrap: anywhere;
   font-size: 0.95rem;
}

.technical-visual {
   position: relative;
   display: grid;
   min-height: 610px;
   margin: 44px 0 76px;
   place-items: center;
   border-top: 1px solid var(--line-dark);
   border-bottom: 1px solid var(--line-dark);
   background: transparent;
   overflow: hidden;
}

.technical-visual > p {
   position: absolute;
   right: 18px;
   bottom: 14px;
   margin: 0;
   color: var(--forest);
   font-family: var(--font-drafting);
   font-size: 0.62rem;
   font-weight: 700;
}

.technical-visual__axis {
   position: absolute;
   top: 50%;
   right: 6%;
   left: 6%;
   height: 1px;
   background: var(--forest);
}

.technical-visual__axis::after {
   content: "";
   position: absolute;
   top: -270px;
   left: 50%;
   width: 1px;
   height: 540px;
   background: var(--forest);
}

.technical-visual__machine {
   position: relative;
   z-index: 1;
   width: min(48vw, 520px);
   height: 380px;
   border: 22px solid var(--forest);
   box-shadow: inset 0 -100px 0 #dce8dc, inset 0 -103px 0 var(--forest);
}

.technical-visual__machine::before {
   content: "";
   position: absolute;
   top: 62px;
   left: 50%;
   width: 96px;
   height: 170px;
   border: 9px solid var(--rust);
   transform: translateX(-50%);
}

.technical-visual__keyboard {
   position: relative;
   z-index: 1;
   width: min(66vw, 760px);
   height: 280px;
   border: 16px solid var(--blue);
   background-image: repeating-linear-gradient(90deg, transparent 0 51px, var(--blue) 51px 55px);
   box-shadow: inset 0 48px 0 transparent, inset 0 52px 0 var(--blue), inset 0 104px 0 transparent, inset 0 108px 0 var(--blue), inset 0 160px 0 transparent, inset 0 164px 0 var(--blue);
}

.technical-visual__generated {
   position: relative;
   z-index: 1;
   display: grid;
   width: min(44vw, 420px);
   aspect-ratio: 1;
   place-items: center;
   border: 14px solid var(--forest);
   color: var(--forest);
   background: transparent;
   font-family: var(--font-drafting);
   font-size: 4rem;
   font-weight: 700;
}

.project-overview {
   display: grid;
   grid-template-columns: minmax(0, 1.1fr) minmax(340px, 0.9fr);
   gap: 64px;
   padding: 82px 0 82px;
}

.project-copy h2 {
   margin-bottom: 24px;
   font-size: 3.5rem;
}

.project-copy > p:not(.draft-label) {
   max-width: 700px;
   color: var(--ink-soft);
   font-size: 1.08rem;
}

.project-copy .tags {
   margin-top: 28px;
}

.project-specs {
   align-self: start;
   margin: 0;
   border-top: 2px solid var(--forest-dark);
}

.project-specs div {
   display: grid;
   grid-template-columns: 120px 1fr;
   gap: 16px;
   padding: 14px 0;
   border-bottom: 1px solid var(--line);
}

.project-specs dt,
.project-specs dd {
   margin: 0;
}

.campad-overview {
   padding-top: 82px;
}

.project-narrative {
   display: grid;
   grid-template-columns: minmax(230px, 0.55fr) minmax(0, 1.45fr);
   gap: 64px;
   padding: 82px 0 92px;
   border-top: 1px solid var(--line-dark);
}

.project-narrative__heading {
   align-self: start;
}

.project-narrative__heading h2 {
   max-width: 400px;
   margin-bottom: 0;
   font-size: 3rem;
}

.project-narrative__body {
   min-width: 0;
}

.project-narrative__body > p {
   max-width: 850px;
   color: var(--ink-soft);
   font-size: 1.04rem;
}

.project-narrative__body h3 {
   margin-bottom: 16px;
   font-size: 1.55rem;
}

.project-narrative__body h4 {
   margin-bottom: 12px;
   font-size: 1.08rem;
}

.project-columns {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: 48px;
   margin-top: 42px;
}

.project-columns--ruled {
   padding-top: 22px;
   border-top: 1px solid var(--line);
}

.project-columns--ruled > div + div {
   padding-left: 48px;
   border-left: 1px solid var(--line);
}

.project-columns p,
.project-subsection > p {
   color: var(--ink-soft);
}

.project-subsection {
   margin-top: 52px;
   padding-top: 28px;
   border-top: 1px solid var(--line);
}

.technical-list {
   margin: 0;
   padding: 0;
   list-style: none;
}

.technical-list li {
   position: relative;
   padding: 8px 0 8px 24px;
   border-bottom: 1px solid color-mix(in srgb, var(--line) 65%, transparent);
   color: var(--ink-soft);
}

.technical-list li::before {
   content: "+";
   position: absolute;
   left: 0;
   color: var(--forest);
   font-family: var(--font-drafting);
}

.technical-list--two-column {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   column-gap: 42px;
}

.technical-list--inline {
   display: grid;
   grid-template-columns: repeat(5, minmax(0, 1fr));
   margin-top: 30px;
   border-top: 1px solid var(--line);
}

.technical-list--inline li {
   min-height: 74px;
   padding: 14px 12px 12px 22px;
   border-right: 1px solid var(--line);
}

.technical-list--inline li:last-child {
   border-right: 0;
}

.technical-values {
   padding: 16px 0;
   border-top: 1px solid var(--line);
   border-bottom: 1px solid var(--line);
   color: var(--forest-dark) !important;
   font-family: var(--font-drafting);
   font-size: 0.9rem;
   font-weight: 700;
   overflow-wrap: anywhere;
}

.table-wrap {
   max-width: 100%;
   overflow-x: auto;
}

.project-data-table {
   width: 100%;
   border-collapse: collapse;
   color: var(--ink-soft);
   font-size: 0.94rem;
}

.project-data-table th,
.project-data-table td {
   padding: 12px 14px;
   border-bottom: 1px solid var(--line);
   text-align: left;
   vertical-align: top;
}

.project-data-table th {
   border-top: 2px solid var(--forest-dark);
   color: var(--ink-strong);
   font-family: var(--font-drafting);
   font-size: 0.68rem;
   text-transform: uppercase;
}

.project-data-table th:first-child,
.project-data-table td:first-child {
   width: 110px;
}

.project-data-table--bom th:first-child,
.project-data-table--bom td:first-child {
   width: 92px;
}

.project-data-table--bom th:nth-child(2),
.project-data-table--bom td:nth-child(2) {
   width: 34%;
}

.project-result {
   padding-right: 5%;
   padding-bottom: 8px;
   padding-left: 28px;
   border-left: 3px double var(--forest);
}

.process-register {
   display: grid;
   grid-template-columns: minmax(280px, 0.75fr) minmax(0, 1.25fr);
   gap: 72px;
   padding: 74px 0 84px;
   border-top: 1px solid var(--line-dark);
}

.process-register header {
   position: static;
   align-self: start;
}

.process-register h2 {
   margin-bottom: 0;
   font-size: 3rem;
}

.process-register ol {
   margin: 0;
   padding: 0;
   border-top: 2px solid var(--forest-dark);
   list-style: none;
}

.process-register li {
   display: grid;
   grid-template-columns: 46px 1fr;
   gap: 18px;
   padding: 24px 0;
   border-bottom: 1px solid var(--line-dark);
}

.process-register li > span {
   color: var(--forest);
   font-family: var(--font-drafting);
   font-size: 0.68rem;
   font-weight: 700;
}

.process-register h3 {
   margin-bottom: 8px;
   font-size: 1.45rem;
}

.process-register li p {
   margin-bottom: 0;
   color: var(--ink-soft);
}

.model-bay {
   display: grid;
   grid-template-columns: minmax(300px, 0.8fr) minmax(0, 1.2fr);
   gap: 54px;
   align-items: center;
   min-height: 420px;
   padding: 58px 0;
   border-top: 1px solid var(--line-dark);
   border-bottom: 1px solid var(--line-dark);
   background: transparent;
   color: var(--ink);
}

.model-bay h2 {
   margin-bottom: 18px;
   font-size: 3rem;
}

.model-bay p:not(.draft-label) {
   max-width: 600px;
   margin-bottom: 0;
   color: var(--ink-soft);
}

.model-bay .draft-label {
   color: var(--forest);
}

.model-bay__diagram {
   position: relative;
   width: min(100%, 330px);
   aspect-ratio: 1;
   justify-self: center;
   border: 1px solid var(--line-dark);
   border-radius: 50%;
}

.model-bay__diagram::before,
.model-bay__diagram::after {
   content: "";
   position: absolute;
   top: 50%;
   left: 50%;
   background: var(--forest);
   transform-origin: left center;
}

.model-bay__diagram::before {
   width: 42%;
   height: 1px;
   transform: rotate(-28deg);
}

.model-bay__diagram::after {
   width: 34%;
   height: 1px;
   transform: rotate(91deg);
}

.model-bay__diagram span {
   position: absolute;
   color: var(--forest);
   font-family: var(--font-drafting);
   font-size: 0.64rem;
}

.model-bay__diagram span:nth-child(1) { right: 3%; top: 31%; }
.model-bay__diagram span:nth-child(2) { top: 4%; left: 49%; }
.model-bay__diagram span:nth-child(3) { bottom: 12%; left: 12%; }

.project-sequence {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   margin: 76px 0 112px;
   border-top: 1px solid var(--line-dark);
   border-bottom: 1px solid var(--line-dark);
}

.project-sequence a {
   display: grid;
   min-height: 112px;
   align-content: center;
   padding: 18px 24px;
}

.project-sequence a + a {
   border-left: 1px solid var(--line-dark);
   text-align: right;
}

.project-sequence span {
   margin-bottom: 8px;
   color: var(--forest);
   font-family: var(--font-drafting);
   font-size: 0.65rem;
   text-transform: uppercase;
}

.project-sequence strong {
   font-size: 1.3rem;
}

.project-page figcaption {
   display: none;
}

.project-photo-gallery {
   display: grid;
   grid-template-columns: minmax(0, 1fr) 112px;
   gap: 12px;
   margin: 44px 0 76px;
}

.project-placeholder-gallery {
   margin: 44px 0 76px;
   border: 0;
   background: transparent;
}

.project-placeholder-gallery figure {
   margin: 0;
}

.project-placeholder-gallery img {
   width: 100%;
   max-height: min(68vh, 760px);
   aspect-ratio: 16 / 9;
   object-fit: cover;
}

.project-placeholder-gallery figcaption {
   padding: 9px 12px;
   border-top: 1px solid var(--line);
   color: var(--ink-soft);
   font-size: 0.75rem;
   font-style: italic;
}

.project-main-photo {
   margin: 0;
   border: 0;
   background: transparent;
}

.project-main-photo img {
   width: 100%;
   height: min(68vh, 760px);
   object-fit: contain;
}

.project-main-photo figcaption {
   padding: 9px 12px;
   border-top: 1px solid var(--line);
   color: var(--ink-soft);
   font-size: 0.75rem;
   font-style: italic;
}

.thumbnail-row {
   display: grid;
   grid-auto-rows: 92px;
   gap: 10px;
   align-content: start;
}

.thumbnail {
   width: 100%;
   min-height: 92px;
   padding: 0;
   border: 0;
   border-bottom: 3px solid transparent;
   border-radius: 0;
   background: transparent;
   overflow: hidden;
}

.thumbnail img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}

.text-link {
   display: inline-flex;
   margin-top: 16px;
   gap: 12px;
   border-bottom: 1px solid var(--forest);
   color: var(--forest);
   font-weight: 700;
}

.project-photo-gallery--single {
   grid-template-columns: minmax(0, 1fr);
}

.project-section-heading {
   display: grid;
   grid-template-columns: minmax(130px, 0.35fr) minmax(0, 1.65fr);
   gap: 30px;
   align-items: end;
   margin-bottom: 34px;
}

.project-section-heading .draft-label {
   margin-bottom: 5px;
}

.project-section-heading h2 {
   margin-bottom: 0;
   overflow-wrap: anywhere;
   font-size: 3.3rem;
}

.project-model {
   padding: 78px 0 92px;
   border-top: 1px solid var(--line-dark);
}

.project-model .project-section-heading h2 {
   display: none;
}

.project-model__viewport {
   position: relative;
   width: 100%;
   height: clamp(440px, 70svh, 820px);
   background-image: none !important;
}

.project-model model-viewer {
   width: 100%;
   height: 100%;
   background: transparent;
   --poster-color: transparent;
   --progress-bar-color: transparent;
}

.project-model__viewport:not(.is-model-ready) model-viewer {
   opacity: 0;
   pointer-events: none;
}

.project-model__viewport .paper-flight__model-poster {
   background-image: none !important;
}

.project-model__loading {
   position: absolute;
   inset: 0;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   gap: 16px;
   padding: 24px;
   color: var(--ink-soft);
   font-size: 0.85rem;
   text-align: center;
   pointer-events: none;
}

.project-model__loading[hidden] {
   display: none;
}

.project-model__loading img {
   width: 64px;
   height: 64px;
   object-fit: contain;
   animation: project-model-loading-spin 2.4s linear infinite;
}

.is-model-error .project-model__loading img {
   animation: none;
}

@keyframes project-model-loading-spin {
   to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
   .project-model__loading img {
      animation: none;
   }
}

.project-files {
   display: grid;
   grid-template-columns: minmax(220px, 0.55fr) minmax(0, 1.45fr);
   gap: 64px;
   padding: 76px 0 30px;
   border-top: 1px solid var(--line-dark);
}

.project-files .project-section-heading {
   display: block;
   margin: 0;
}

.project-files .project-section-heading h2 {
   font-size: 3rem;
}

.project-files ul {
   margin: 0;
   padding: 0;
   border-top: 2px solid var(--forest-dark);
   list-style: none;
}

.project-files__body > p {
   max-width: 780px;
   margin-bottom: 28px;
   color: var(--ink-soft);
}

.project-files li {
   border-bottom: 1px solid var(--line-dark);
}

.project-files a {
   display: grid;
   min-height: 76px;
   grid-template-columns: minmax(0, 1fr) auto 24px;
   gap: 18px;
   align-items: center;
   padding: 12px 0;
}

.project-files a > span:first-child {
   overflow-wrap: anywhere;
   font-size: 1.15rem;
   font-weight: 700;
}

.project-files small {
   color: var(--ink-soft);
   font-family: var(--font-drafting);
   font-size: 0.64rem;
   white-space: nowrap;
}

.project-files a > span:last-child {
   color: var(--forest);
   font-family: var(--font-drafting);
}

.about-hero {
   display: grid;
   grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
   gap: 80px;
   align-items: end;
   padding: 88px 0 68px;
   border-bottom: 1px solid var(--line-dark);
}

.about-index {
   display: grid;
   border-top: 2px solid var(--forest-dark);
}

.about-index span {
   padding: 9px 0;
   border-bottom: 1px solid var(--line);
   color: var(--ink-soft);
}

.about-body {
   display: grid;
   grid-template-columns: minmax(0, 0.95fr) minmax(360px, 1.05fr);
   gap: 84px;
   padding: 80px 0 94px;
}

.about-copy p {
   color: var(--ink-soft);
   font-size: 1.08rem;
}

.about-copy .about-dropcap {
   color: var(--ink);
   font-size: 1.45rem;
}

.about-dropcap::first-letter {
   float: left;
   margin: 8px 9px 0 0;
   color: var(--forest);
   font-size: 4.4rem;
   font-weight: 700;
   line-height: 0.72;
}

.working-method h2 {
   margin-bottom: 28px;
   font-size: 3rem;
}

.working-method ol {
   margin: 0;
   padding: 0;
   border-top: 2px solid var(--forest-dark);
   list-style: none;
}

.working-method li {
   display: grid;
   grid-template-columns: 44px 1fr;
   gap: 16px;
   padding: 22px 0;
   border-bottom: 1px solid var(--line-dark);
}

.working-method li > span {
   color: var(--forest);
   font-family: var(--font-drafting);
   font-size: 0.68rem;
   font-weight: 700;
}

.working-method h3 {
   margin-bottom: 7px;
   font-size: 1.35rem;
}

.working-method li p {
   margin-bottom: 0;
   color: var(--ink-soft);
}

.about-contact-band {
   padding: 68px 0 110px;
   border-top: 1px solid var(--line-dark);
}

.about-contact-band h2 {
   max-width: 850px;
   margin-bottom: 32px;
   font-size: 3.7rem;
}

.contact-hero {
   display: grid;
   min-height: 56vh;
   grid-template-columns: minmax(0, 1.25fr) minmax(300px, 0.75fr);
   gap: 72px;
   align-items: end;
   padding: 90px 0 72px;
   border-bottom: 1px solid var(--line-dark);
}

.contact-register {
   margin-bottom: 82px;
   border-top: 1px solid var(--line-dark);
}

.contact-register > a,
.contact-register__pending {
   display: grid;
   min-height: 138px;
   grid-template-columns: 64px 1fr;
   gap: 20px;
   align-items: center;
   border-bottom: 1px solid var(--line-dark);
}

.contact-register p {
   margin-bottom: 4px;
   color: var(--ink-soft);
   font-size: 0.86rem;
   font-style: italic;
}

.contact-register h2 {
   margin-bottom: 0;
   overflow-wrap: anywhere;
   font-size: 2rem;
}

.contact-register__pending {
   color: var(--ink-soft);
}

.contact-register__pending h2 {
   font-size: 1.45rem;
   font-weight: 400;
}

.contact-note {
   padding: 72px 0 0;
}

.contact-note p:last-child {
   color: var(--ink-soft);
}

/* Contact page: content is drafted directly onto the continuous sheet. */
.contact-page .contact-hero {
   display: block;
   min-height: 0;
   padding: 96px 0 84px;
   border: 0;
}

.contact-context {
   display: grid;
   grid-template-columns: minmax(0, 7fr) minmax(260px, 3fr);
   gap: clamp(52px, 7vw, 104px);
   align-items: start;
   padding: 72px 0 120px;
}

.contact-context__copy h2,
.contact-section__heading h2 {
   max-width: 820px;
   margin: 0 0 30px;
   font-size: clamp(2.5rem, 4.2vw, 4.2rem);
}

.contact-context__copy > p:not(.draft-label) {
   max-width: 830px;
   color: var(--ink-soft);
   font-size: 1.03rem;
}

.contact-meta {
   display: flex;
   flex-wrap: wrap;
   gap: 20px 48px;
   margin: 34px 0 0;
}

.contact-meta div {
   display: flex;
   gap: 12px;
}

.contact-meta dt,
.contact-meta dd {
   margin: 0;
}

.contact-meta dt {
   color: var(--forest);
   font-family: var(--font-drafting);
   font-size: 0.72rem;
   text-transform: uppercase;
}

.contact-meta dd {
   color: var(--ink-soft);
   font-size: 0.86rem;
   text-transform: uppercase;
}

.quick-contact {
   padding-top: 4px;
}

.contact-context__rail {
   display: flex;
   min-width: 0;
   flex-direction: column;
   align-items: stretch;
}

.quick-contact > a {
   display: grid;
   grid-template-columns: minmax(0, 1fr) auto;
   gap: 16px;
   align-items: end;
   padding: 17px 0;
}

.quick-contact a > span:first-child,
.quick-contact a strong,
.quick-contact a small {
   display: block;
}

.quick-contact a strong {
   font-family: var(--font-drafting);
   font-size: 1.08rem;
   font-weight: 400;
}

.quick-contact a small {
   margin-top: 3px;
   color: var(--ink-soft);
   overflow-wrap: anywhere;
}

.quick-contact a > span:last-child {
   color: var(--forest);
   font-family: var(--font-drafting);
   font-size: 0.63rem;
   text-transform: uppercase;
}

.contact-section {
   padding: 96px 0 132px;
}

.contact-section__heading {
   margin-bottom: 70px;
}

.contact-message__layout {
   display: grid;
   grid-template-columns: minmax(0, 1.12fr) minmax(420px, 0.88fr);
   gap: clamp(48px, 6vw, 88px);
   align-items: start;
}

.contact-message__form-column {
   min-width: 0;
}

@media (min-width: 981px) {
   .contact-message {
      display: grid;
      grid-template-columns: minmax(420px, 0.88fr) minmax(0, 1.12fr);
      column-gap: clamp(48px, 6vw, 88px);
   }

   .contact-message > .contact-section__heading {
      grid-column: 2;
      grid-row: 1;
   }

   .contact-message__layout {
      display: contents;
   }

   .contact-message__form-column {
      grid-column: 2;
      grid-row: 2;
   }

   .contact-message .contact-drawings--single {
      grid-column: 1;
      grid-row: 2;
   }
}

.contact-form__grid {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: 30px 26px;
}

.contact-field {
   display: block;
   min-width: 0;
}

.contact-field--wide {
   grid-column: 1 / -1;
}

.contact-field > span {
   display: flex;
   gap: 9px;
   align-items: baseline;
   margin-bottom: 8px;
   color: var(--ink-strong);
   font-family: var(--font-drafting);
   font-size: 0.82rem;
   text-transform: uppercase;
}

.contact-field > span b {
   color: var(--forest);
   font-weight: 400;
}

.contact-field > span em {
   margin-left: auto;
   color: var(--ink-soft);
   font-family: var(--font-body);
   font-size: 0.66rem;
   font-style: normal;
}

.contact-field input,
.contact-field select,
.contact-field textarea {
   width: 100%;
   border: 1px solid rgba(32, 75, 56, 0.36);
   border-radius: 0;
   outline: 0;
   color: var(--ink-strong);
   background: rgba(245, 240, 227, 0.56);
}

.contact-field input,
.contact-field select {
   min-height: 48px;
   padding: 10px 12px;
}

.contact-field textarea {
   min-height: 190px;
   padding: 12px;
   resize: vertical;
}

.contact-field input:focus,
.contact-field select:focus,
.contact-field textarea:focus {
   border-color: var(--forest);
   box-shadow: inset 3px 0 0 var(--forest);
}

.contact-field [aria-invalid="true"] {
   border-color: var(--rust);
   box-shadow: inset 3px 0 0 var(--rust);
}

.contact-field > small {
   display: block;
   margin-top: 7px;
   color: var(--ink-soft);
   font-size: 0.76rem;
}

.contact-file > .contact-file__control {
   position: relative;
   display: grid;
   grid-template-columns: minmax(116px, auto) minmax(0, 1fr);
   gap: 0;
   min-height: 52px;
   align-items: stretch;
   margin: 0;
   border: 1px solid rgba(32, 75, 56, 0.56);
   color: var(--ink-strong);
   background: rgba(var(--paper-rgb), 0.72);
   font-family: var(--font-body);
   font-size: 0.9rem;
   text-transform: none;
}

.contact-file__trigger,
.contact-file__name {
   display: flex;
   min-width: 0;
   align-items: center;
   padding: 11px 14px;
}

.contact-file__trigger {
   border-right: 1px solid rgba(32, 75, 56, 0.56);
   color: var(--paper-light);
   background: var(--forest);
   font-family: var(--font-drafting);
   font-size: 0.74rem;
   letter-spacing: 0.08em;
   text-transform: uppercase;
}

.contact-file__name {
   overflow: hidden;
   color: var(--ink-soft);
   line-height: 1.35;
   text-overflow: ellipsis;
   white-space: nowrap;
}

.contact-file__name.has-file {
   color: var(--ink-strong);
   font-weight: 700;
}

.contact-file__input {
   position: absolute;
   inset: 0;
   z-index: 1;
   width: 100%;
   height: 100%;
   min-height: 0 !important;
   padding: 0 !important;
   cursor: pointer;
   opacity: 0;
}

.contact-file__control:hover {
   border-color: var(--forest-dark);
}

.contact-file__control:focus-within {
   border-color: var(--forest-dark);
   outline: 3px solid var(--signal);
   outline-offset: 3px;
}

.contact-file__control:has(.contact-file__input[aria-invalid="true"]) {
   border-color: var(--rust);
   outline: 2px solid var(--rust);
   outline-offset: 2px;
}

.contact-form__actions {
   display: flex;
   flex-wrap: wrap;
   column-gap: clamp(32px, 4vw, 56px);
   row-gap: 16px;
   align-items: center;
   margin-top: 34px;
}

.contact-availability {
   flex: 0 0 auto;
   margin: 0;
   color: var(--ink-soft);
   font-size: 0.86rem;
   line-height: 1.45;
   text-transform: uppercase;
}

.contact-submit,
.contact-success button {
   min-height: 48px;
   border: 0;
   border-radius: 0;
   padding: 12px 18px;
   color: var(--paper-light);
   background: var(--forest-dark);
   font-family: var(--font-drafting);
   text-transform: uppercase;
}

.contact-submit {
   display: inline-grid;
   min-width: 276px;
   min-height: 62px;
   grid-template-columns: minmax(0, 1fr) 54px;
   padding: 0;
   border: 2px solid var(--forest-dark);
   box-shadow: 4px 4px 0 rgba(32, 38, 36, 0.17);
   cursor: pointer;
   letter-spacing: 0.07em;
}

.contact-submit__copy {
   display: grid;
   gap: 3px;
   align-content: center;
   padding: 9px 14px;
   text-align: left;
}

.contact-submit__copy > span {
   color: rgba(245, 240, 227, 0.72);
   font-size: 0.58rem;
   letter-spacing: 0.13em;
}

.contact-submit__mark {
   display: grid;
   place-items: center;
   border-left: 1px solid rgba(245, 240, 227, 0.48);
   font-family: var(--font-body);
   font-size: 1.22rem;
}

.contact-submit:hover:not(:disabled) {
   background: var(--ink-strong);
}

.contact-submit:focus-visible {
   outline: 3px solid var(--signal);
   outline-offset: 4px;
}

.contact-submit:active:not(:disabled) {
   box-shadow: 2px 2px 0 rgba(32, 38, 36, 0.2);
   transform: translate(2px, 2px);
}

.contact-submit:disabled {
   cursor: wait;
   opacity: 0.58;
}

.contact-form__status {
   flex: 0 0 100%;
   margin: 0;
   color: var(--ink-soft);
   font-size: 0.86rem;
}

.contact-form__status:empty {
   display: none;
}

.contact-form__status.is-error {
   color: var(--rust);
}

.contact-honeypot {
   position: absolute;
   width: 1px;
   height: 1px;
   overflow: hidden;
   clip: rect(0 0 0 0);
   clip-path: inset(50%);
   white-space: nowrap;
}

.contact-drawings {
   display: grid;
   gap: 84px;
}

.contact-drawing {
   position: relative;
   min-width: 0;
   height: clamp(360px, 40vw, 540px);
}

.contact-drawing--context {
   width: min(520px, 42vw);
   height: clamp(300px, 24vw, 340px);
   flex: 0 0 auto;
   align-self: flex-end;
   margin-top: 18px;
}

@media (min-width: 1181px) {
   .contact-context__copy > p:not(.draft-label) {
      /* Keep the heading broad while reserving room beside the body copy
         for the full pigment wash at each desktop sheet width. */
      max-width: min(600px, calc(var(--draft-frame-width, calc(100vw - 48px)) - 672px));
   }

   .contact-drawing--context {
      /* Bring the SVG and its wash inward together beside the narrower copy. */
      transform: translate(-56px, 144px);
   }

   .contact-drawing--context .blueprint-pigment--engraving-mill-v2 {
      /* Grow the wash exactly 15% about its center. Expanding its box keeps
         the organic edge intact while the SVG and the grid scale stay fixed. */
      top: calc(-7.5% - 45.25px);
      right: calc(-7.5% - 63.25px);
      bottom: calc(-7.5% - 35.25px);
      left: calc(-7.5% - 63.25px);
      --pigment-grid-x: 46.25px;
      --pigment-grid-y: 29.75px;
   }

   .contact-drawing--context > span:not(.blueprint-pigment) {
      transform: translateY(40px);
   }
}

.contact-drawings.contact-drawings--single {
   grid-template-columns: 1fr;
}

@media (min-width: 981px) {
   .contact-drawings.contact-drawings--single {
      margin-top: clamp(72px, 5.5vw, 86px);
   }

   .contact-drawings--single .contact-drawing {
      height: clamp(440px, 40vw, 570px);
   }
}

@media (min-width: 1440px) {
   .contact-drawings.contact-drawings--single {
      width: 566px;
      justify-self: start;
      transform: translateX(clamp(-32px, calc(706px - 50vw), -14px));
   }
}

.contact-drawing .scroll-drawing__svg {
   width: 100%;
   height: calc(100% - 30px);
   pointer-events: none;
}

.contact-drawing > span:not(.blueprint-pigment) {
   position: absolute;
   right: 0;
   bottom: 0;
   color: var(--forest);
   font-family: var(--font-drafting);
   font-size: 0.66rem;
}

@media (min-width: 981px) {
   .contact-drawing--flatbed .blueprint-pigment--ford-ranger-flatbed {
      /* Extend only the blue wash by two drafting-grid cells toward the
         annotated top and left edges; the sibling SVG remains unchanged. */
      top: -88px;
      right: -61px;
      bottom: -34px;
      left: -103px;
   }

   .contact-drawing--flatbed > span:not(.blueprint-pigment) {
      transform: translate(clamp(-120px, calc(663px - 50vw), -16px), 15px);
   }
}

.contact-links__layout {
   display: grid;
   grid-template-columns: minmax(0, 1fr) minmax(390px, 0.82fr);
   gap: clamp(60px, 8vw, 120px);
   align-items: start;
}

.contact-links .contact-register {
   margin: 0;
   border: 0;
}

.contact-links .contact-register > a {
   min-height: 122px;
   grid-template-columns: minmax(0, 1fr);
   gap: 0;
   border: 0;
}

.contact-register a > span strong,
.contact-register a > span small {
   display: block;
}

.contact-register a > span strong {
   font-family: var(--font-drafting);
   font-size: 1.55rem;
   font-weight: 400;
}

.contact-register a > span small {
   max-width: 580px;
   margin-top: 5px;
   color: var(--ink-soft);
   font-size: 0.82rem;
}

.contact-drawing--large {
   position: sticky;
   top: 106px;
   height: min(560px, 66vh);
}

@media (min-width: 981px) {
   .contact-links {
      display: grid;
      grid-template-columns: minmax(390px, 0.82fr) minmax(0, 1fr);
      column-gap: 120px;
      align-items: start;
   }

   .contact-links > .contact-section__heading {
      grid-column: 2;
      grid-row: 1;
   }

   .contact-links__layout {
      display: contents;
   }

   .contact-links .contact-register {
      grid-column: 2;
      grid-row: 2;
   }

   .contact-links .contact-drawing--large {
      grid-column: 1;
      grid-row: 2;
   }

   .contact-drawing--large .blueprint-pigment--squareness-comparator {
      /* Extend only the blue wash by three drafting-grid cells toward the
         annotated top and right edges; the sibling SVG remains unchanged. */
      top: -112px;
      right: -127px;
   }

   .contact-drawing--large > span:not(.blueprint-pigment) {
      transform: translate(clamp(16px, calc(50vw - 648px), 60px), 20px);
   }
}

.contact-note > div > p:last-child {
   max-width: 820px;
   margin-bottom: 0;
}

/* Quiet paper clearings reduce only the faint printed grid behind dense copy. */
:is(
   .about-v2__hero-copy,
   .about-v2__copy,
   .about-v2__section-head,
   .about-v2__principles,
   .about-v2__guatemala-copy,
   .about-v2__outside,
   .about-v2__next-copy,
   .about-v2__actions,
   .contact-hero > div,
   .contact-context__copy,
   .quick-contact,
   .contact-section__heading,
   .contact-form,
   .contact-register,
   .contact-note > div
) {
   position: relative;
   isolation: isolate;
}

:is(
   .about-v2__hero-copy,
   .about-v2__copy,
   .about-v2__section-head,
   .about-v2__principles,
   .about-v2__guatemala-copy,
   .about-v2__outside,
   .about-v2__next-copy,
   .about-v2__actions,
   .contact-hero > div,
   .contact-context__copy,
   .quick-contact,
   .contact-section__heading,
   .contact-form,
   .contact-register,
   .contact-note > div
)::before {
   content: "";
   position: absolute;
   inset: -18px -24px;
   z-index: -1;
   background: radial-gradient(
      ellipse at center,
      rgba(var(--paper-rgb), 0.97) 0 58%,
      rgba(var(--paper-rgb), 0.90) 72%,
      rgba(var(--paper-rgb), 0.52) 86%,
      transparent 100%
   );
   pointer-events: none;
}

.contact-links .contact-register::before {
   content: none;
}

.contact-links .contact-register > a > span {
   position: relative;
   isolation: isolate;
   width: fit-content;
   max-width: 100%;
}

/* Clear the grid only around each link's copy, with a soft paper transition. */
.contact-links .contact-register > a > span::before {
   content: "";
   position: absolute;
   inset: -12px -18px;
   z-index: -1;
   background: rgba(var(--paper-rgb), 0.94);
   filter: blur(14px);
   pointer-events: none;
}

.contact-success {
   width: min(560px, calc(100% - 36px));
   border: 1px solid rgba(32, 75, 56, 0.44);
   border-radius: 0;
   padding: 0;
   color: var(--ink);
   background-color: var(--paper);
   background-image:
      linear-gradient(var(--grid-minor) 1px, transparent 1px),
      linear-gradient(90deg, var(--grid-minor) 1px, transparent 1px);
   background-size: 24px 24px;
}

.contact-success::backdrop {
   background: rgba(20, 27, 23, 0.64);
}

.contact-success__content {
   padding: 48px;
}

.contact-success__status {
   margin: 28px 0 6px;
   color: var(--forest);
   font-family: var(--font-drafting);
   font-size: 0.76rem;
   text-transform: uppercase;
}

.contact-success h2 {
   margin-bottom: 16px;
   font-size: 2.6rem;
}

.contact-success button {
   margin-top: 20px;
}

@media (max-width: 1180px) {
   .contact-context {
      grid-template-columns: 1fr;
      gap: 56px;
   }

   .quick-contact {
      max-width: 620px;
   }
}

@media (max-width: 980px) {
   .contact-context,
   .contact-message__layout,
   .contact-links__layout {
      grid-template-columns: 1fr;
   }

   .contact-context {
      gap: 56px;
   }

   .quick-contact {
      max-width: 620px;
   }

   .contact-drawing--context {
      width: 100%;
      align-self: stretch;
      margin-top: 56px;
   }

   .contact-drawings.contact-drawings--single {
      align-self: start;
      margin-top: 0;
   }

   .contact-drawings {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 36px;
   }

   .contact-drawing,
   .contact-drawing--large {
      position: relative;
      top: auto;
      height: min(480px, 62vw);
   }
}

@media (max-width: 620px) {
   .contact-page .contact-hero {
      padding: 62px 0 50px;
   }

   .contact-context {
      padding: 48px 0 86px;
   }

   .contact-context__copy h2,
   .contact-section__heading h2 {
      font-size: 2.45rem;
   }

   .contact-section {
      padding: 72px 0 94px;
   }

   .contact-section__heading {
      margin-bottom: 46px;
   }

   .contact-form__grid,
   .contact-drawings {
      grid-template-columns: 1fr;
   }

   .contact-field--wide {
      grid-column: auto;
   }

   .contact-form__actions {
      align-items: stretch;
      flex-direction: column;
   }

   .contact-form__status {
      flex-basis: auto;
   }

   .contact-submit {
      width: 100%;
      justify-content: space-between;
   }

   .contact-drawing,
   .contact-drawing--large {
      height: min(390px, 92vw);
   }

   .contact-links .contact-register > a {
      min-height: 108px;
   }

   .contact-register a > span strong {
      font-size: 1.25rem;
   }

   .contact-note {
      padding-top: 56px;
   }

   .contact-success__content {
      padding: 34px 26px;
   }

   .contact-success h2 {
      font-size: 2.1rem;
   }
}

@media (max-width: 1040px) {
   .home-hero {
      min-height: auto;
      grid-template-columns: 1fr;
      padding-top: 70px;
   }

   .hero-drawing {
      width: min(92%, 760px);
      margin: -32px auto 0;
      justify-self: center;
   }

   .featured-project,
   .featured-project--drawing-right {
      min-height: auto;
      grid-template-columns: 1fr;
      gap: 30px;
      padding: 88px 0;
   }

   .featured-project__copy {
      grid-row: 1;
   }

   .featured-project__drawing {
      height: clamp(500px, 66svh, 680px);
      grid-row: 2;
   }

   .featured-project__caption {
      bottom: -70px;
   }

   .hero-copy h1 {
      font-size: 4.25rem;
   }

   .page-intro h1,
   .about-lead h1,
   .contact-hero h1,
   .project-masthead h1 {
      font-size: 4rem;
   }

   .work-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
   }

   .project-overview,
   .about-body {
      gap: 42px;
   }

   .process-register {
      gap: 44px;
   }
}

@media (max-width: 760px) {
   :root {
      --header-height: auto;
   }

   .site-header,
   .page-shell,
   .site-footer {
      width: min(var(--page-width), calc(100% - 28px));
   }

   .site-header {
      position: relative;
      min-height: 0;
      flex-direction: column;
      align-items: stretch;
      gap: 12px;
      padding: 14px 0 0;
   }

   .toplinks {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      width: 100%;
      max-width: none;
      min-height: 48px;
      border-top: 1px solid var(--line);
   }

   .toplinks a {
      min-width: 0;
      padding: 0 10px;
      font-size: 0.84rem;
      text-align: center;
   }

   .home-hero {
      min-height: auto;
      gap: 42px;
      padding: 66px 0 78px;
   }

   .hero-drawing {
      width: 100%;
      margin: -8px 0 0;
   }

   .hero-drawing .scroll-drawing__svg {
      transform: scale(0.952);
   }

   .featured-project--drawing-left .scroll-drawing__svg,
   .featured-project--drawing-right .scroll-drawing__svg {
      transform: scale(1.08);
   }

   .featured-project--drawing-right .scroll-drawing__svg {
      transform: scale(0.872);
   }

   .contact-drawing .scroll-drawing__svg {
      transform: scale(1.08);
   }

   .hero-drawing .blueprint-pigment {
      inset: -18px -22px;
   }

   .featured-project.featured-project--drawing-left .blueprint-pigment,
   .featured-project.featured-project--drawing-right .blueprint-pigment {
      top: -22px;
      right: -18px;
      bottom: -22px;
      left: -18px;
      transform: none;
   }

   .featured-project__caption {
      bottom: -52px;
   }

   .about-v2__inline-drawing .blueprint-pigment,
   .contact-drawing .blueprint-pigment {
      top: -24px;
      right: -18px;
      bottom: 6px;
      left: -18px;
   }

   .about-v2__knife-vertical .blueprint-pigment--knife-02 {
      top: -24px;
      bottom: -6px;
   }

   .hero-drawing figcaption {
      right: 7%;
      bottom: -12px;
   }

   .featured-project {
      gap: 24px;
      padding: 72px 0 82px;
   }

   .featured-project__drawing {
      height: clamp(420px, 62svh, 560px);
   }

   .featured-project__copy h2 {
      margin-bottom: 24px;
      font-size: 3rem;
   }

   .featured-project__copy > p:not(.draft-label) {
      font-size: 1.04rem;
   }

   .hero-copy h1 {
      font-size: 3.15rem;
   }

   .hero-summary {
      font-size: 1.08rem;
   }

   .hero-actions {
      align-items: flex-start;
      flex-direction: column;
   }

   .section-heading {
      grid-template-columns: 1fr;
      gap: 12px;
   }

   .section-heading h2 {
      font-size: 2.75rem;
   }

   .project-register li {
      padding: 18px 0;
   }

   .project-register a {
      min-height: 76px;
   }

   .site-footer {
      align-items: flex-start;
      flex-direction: column;
      justify-content: center;
      padding: 26px 0 94px;
   }

   .page-intro,
   .project-masthead,
   .project-overview,
   .process-register,
   .model-bay,
   .about-hero,
   .about-body,
   .contact-hero {
      grid-template-columns: 1fr;
   }

   .page-intro,
   .project-masthead,
   .about-hero,
   .contact-hero {
      gap: 24px;
      padding: 58px 0 42px;
   }

   .project-masthead--files {
      min-height: 0;
   }

   .project-masthead--case-study {
      min-height: 0;
   }

   .page-intro h1,
   .about-lead h1,
   .contact-hero h1,
   .project-masthead h1 {
      font-size: 3.1rem;
   }

   .catalog-tools {
      grid-template-columns: 1fr;
      align-items: stretch;
   }

   .catalog-count {
      margin-bottom: 0;
   }

   .work-grid {
      grid-template-columns: 1fr;
      gap: 48px;
      margin-bottom: 76px;
   }

   .project-card__link {
      min-height: 0;
   }

   .project-cover {
      min-height: 250px;
   }

   .project-facts {
      grid-template-columns: repeat(2, minmax(0, 1fr));
   }

   .project-facts div {
      border-right: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
   }

   .project-facts div:nth-child(even) {
      border-right: 0;
   }

   .project-facts div:nth-last-child(2):nth-child(odd),
   .project-facts div:last-child {
      border-bottom: 0;
   }

   .technical-visual {
      min-height: 420px;
      margin: 30px 0 58px;
   }

   .technical-visual__machine {
      width: 250px;
      height: 210px;
      border-width: 14px;
      box-shadow: inset 0 -54px 0 #dce8dc, inset 0 -57px 0 var(--forest);
   }

   .technical-visual__machine::before {
      top: 32px;
      width: 58px;
      height: 94px;
      border-width: 6px;
   }

   .technical-visual__keyboard {
      width: min(88vw, 460px);
      height: 176px;
      border-width: 10px;
      background-image: repeating-linear-gradient(90deg, transparent 0 30px, var(--blue) 30px 33px);
      box-shadow: inset 0 29px 0 transparent, inset 0 32px 0 var(--blue), inset 0 62px 0 transparent, inset 0 65px 0 var(--blue), inset 0 95px 0 transparent, inset 0 98px 0 var(--blue);
   }

   .project-overview {
      gap: 38px;
      padding-top: 58px;
      padding-bottom: 62px;
   }

   .campad-overview {
      padding-top: 58px;
   }

   .project-narrative {
      grid-template-columns: 1fr;
      gap: 34px;
      padding: 62px 0 68px;
   }

   .project-narrative__heading h2 {
      font-size: 2.45rem;
   }

   .project-columns {
      grid-template-columns: 1fr;
      gap: 32px;
   }

   .project-columns--ruled > div + div {
      padding-top: 28px;
      padding-left: 0;
      border-top: 1px solid var(--line);
      border-left: 0;
   }

   .technical-list--two-column {
      grid-template-columns: 1fr;
   }

   .technical-list--inline {
      grid-template-columns: repeat(2, minmax(0, 1fr));
   }

   .technical-list--inline li:nth-child(even) {
      border-right: 0;
   }

   .technical-list--inline li:last-child {
      grid-column: 1 / -1;
   }

   .project-copy h2,
   .working-method h2,
   .model-bay h2 {
      font-size: 2.55rem;
   }

   .process-register {
      gap: 30px;
      padding: 58px 0 64px;
   }

   .process-register header {
      position: static;
   }

   .process-register h2 {
      font-size: 2.45rem;
   }

   .model-bay {
      gap: 30px;
      min-height: 0;
      padding: 42px 0;
   }

   .model-bay__diagram {
      width: min(74vw, 280px);
   }

   .project-sequence {
      grid-template-columns: 1fr;
      margin: 58px 0 80px;
   }

   .project-sequence a + a {
      border-top: 1px solid var(--line-dark);
      border-left: 0;
   }

   .project-photo-gallery {
      grid-template-columns: 1fr;
      margin: 30px 0 58px;
   }

   .project-section-heading {
      grid-template-columns: 1fr;
      gap: 8px;
   }

   .project-section-heading h2 {
      font-size: 2.45rem;
   }

   .project-model {
      padding: 58px 0 68px;
   }

   .project-model__viewport {
      height: clamp(360px, 58svh, 620px);
   }

   .project-files {
      grid-template-columns: 1fr;
      gap: 26px;
      padding-top: 58px;
   }

   .project-files .project-section-heading h2 {
      font-size: 2.45rem;
   }

   .project-main-photo img {
      height: min(60vh, 560px);
   }

   .thumbnail-row {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      grid-auto-rows: 82px;
   }

   .thumbnail {
      min-height: 82px;
   }

   .about-body {
      gap: 52px;
      padding: 58px 0 70px;
   }

   .about-contact-band h2 {
      font-size: 2.8rem;
   }

   .contact-hero {
      min-height: 0;
   }

   .contact-register > a,
   .contact-register__pending {
      grid-template-columns: 38px 1fr;
      gap: 12px;
      padding: 18px 0;
   }

   .contact-register h2 {
      font-size: 1.55rem;
   }

   .contact-register__pending h2 {
      font-size: 1.2rem;
   }

}

@media (max-width: 430px) {
   .hero-copy h1 {
      font-size: 2.55rem;
   }

   .command-link {
      width: 100%;
      justify-content: space-between;
   }

   .page-intro h1,
   .about-lead h1,
   .contact-hero h1,
   .project-masthead h1 {
      font-size: 2.55rem;
   }

   .project-card h2 {
      font-size: 1.75rem;
   }

   .technical-visual > p {
      right: 10px;
      bottom: 8px;
      max-width: calc(100% - 20px);
      font-size: 0.53rem;
   }

   .project-copy h2,
   .working-method h2,
   .model-bay h2,
   .about-contact-band h2 {
      font-size: 2.2rem;
   }

   .project-specs div {
      grid-template-columns: 92px 1fr;
   }

   .process-register h2 {
      font-size: 2.15rem;
   }

   .contact-register > a,
   .contact-register__pending {
      grid-template-columns: 28px minmax(0, 1fr);
   }
}