/* AIFoundri Sourcing, website v2 page shell.
   Tokens live in tokens.css (copied from website/design-system). This file
   only consumes them, plus the inline textures below, which replace the
   ./assets/*.svg files tokens.css points at (they do not exist). */

/*@textures*/
:root {
  --texture-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.032 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --texture-hatch: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Cpath d='M-2 2 L2 -2 M0 8 L8 0 M6 10 L10 6' stroke='rgba(0,0,0,0.07)' stroke-width='1'/%3E%3C/svg%3E");
  --texture-guilloche: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='120'%3E%3Cpath d='M0 0L4 1.9L8 3.7L12 5.3L16 6.7L20 7.8L24 8.6L28 9L32 9L36 8.6L40 7.8L44 6.7L48 5.3L52 3.7L56 1.9L60 0L64 -1.9L68 -3.7L72 -5.3L76 -6.7L80 -7.8L84 -8.6L88 -9L92 -9L96 -8.6L100 -7.8L104 -6.7L108 -5.3L112 -3.7L116 -1.9L120 0L124 1.9L128 3.7L132 5.3L136 6.7L140 7.8L144 8.6L148 9L152 9L156 8.6L160 7.8L164 6.7L168 5.3L172 3.7L176 1.9L180 0L184 -1.9L188 -3.7L192 -5.3L196 -6.7L200 -7.8L204 -8.6L208 -9L212 -9L216 -8.6L220 -7.8L224 -6.7L228 -5.3L232 -3.7L236 -1.9L240 0' fill='none' stroke='rgba(255,255,255,0.22)' stroke-width='0.6'/%3E%3Cpath d='M0 0L4 1.9L8 3.5L12 4.9L16 5.7L20 6L24 5.7L28 4.9L32 3.5L36 1.9L40 0L44 -1.9L48 -3.5L52 -4.9L56 -5.7L60 -6L64 -5.7L68 -4.9L72 -3.5L76 -1.9L80 0L84 1.9L88 3.5L92 4.9L96 5.7L100 6L104 5.7L108 4.9L112 3.5L116 1.9L120 0L124 -1.9L128 -3.5L132 -4.9L136 -5.7L140 -6L144 -5.7L148 -4.9L152 -3.5L156 -1.9L160 0L164 1.9L168 3.5L172 4.9L176 5.7L180 6L184 5.7L188 4.9L192 3.5L196 1.9L200 0L204 -1.9L208 -3.5L212 -4.9L216 -5.7L220 -6L224 -5.7L228 -4.9L232 -3.5L236 -1.9L240 0' fill='none' stroke='rgba(255,255,255,0.12)' stroke-width='0.6'/%3E%3Cpath d='M0 11.7L4 13.3L8 14.7L12 15.8L16 16.6L20 17L24 16.9L28 16.6L32 15.8L36 14.7L40 13.3L44 11.7L48 9.9L52 8L56 6.1L60 4.3L64 2.7L68 1.3L72 0.2L76 -0.6L80 -1L84 -0.9L88 -0.6L92 0.2L96 1.3L100 2.7L104 4.3L108 6.1L112 8L116 9.9L120 11.7L124 13.3L128 14.7L132 15.8L136 16.6L140 17L144 16.9L148 16.6L152 15.8L156 14.7L160 13.3L164 11.7L168 9.9L172 8L176 6.1L180 4.3L184 2.7L188 1.3L192 0.2L196 -0.6L200 -1L204 -0.9L208 -0.6L212 0.2L216 1.3L220 2.7L224 4.3L228 6.1L232 8L236 9.9L240 11.7' fill='none' stroke='rgba(255,255,255,0.22)' stroke-width='0.6'/%3E%3Cpath d='M0 4.6L4 6.3L8 8.2L12 10L16 11.7L20 13L24 13.8L28 14L32 13.7L36 12.8L40 11.4L44 9.7L48 7.8L52 6L56 4.3L60 3L64 2.2L68 2L72 2.3L76 3.2L80 4.6L84 6.3L88 8.2L92 10L96 11.7L100 13L104 13.8L108 14L112 13.7L116 12.8L120 11.4L124 9.7L128 7.8L132 6L136 4.3L140 3L144 2.2L148 2L152 2.3L156 3.2L160 4.6L164 6.3L168 8.2L172 10L176 11.7L180 13L184 13.8L188 14L192 13.7L196 12.8L200 11.4L204 9.7L208 7.8L212 6L216 4.3L220 3L224 2.2L228 2L232 2.3L236 3.2L240 4.6' fill='none' stroke='rgba(255,255,255,0.12)' stroke-width='0.6'/%3E%3Cpath d='M0 22.7L4 23.8L8 24.6L12 25L16 24.9L20 24.6L24 23.8L28 22.7L32 21.3L36 19.6L40 17.9L44 16L48 14.1L52 12.3L56 10.7L60 9.3L64 8.2L68 7.4L72 7L76 7.1L80 7.4L84 8.2L88 9.3L92 10.7L96 12.4L100 14.1L104 16L108 17.9L112 19.7L116 21.3L120 22.7L124 23.8L128 24.6L132 25L136 24.9L140 24.6L144 23.8L148 22.7L152 21.3L156 19.6L160 17.9L164 16L168 14.1L172 12.3L176 10.7L180 9.3L184 8.2L188 7.4L192 7L196 7.1L200 7.4L204 8.2L208 9.3L212 10.7L216 12.4L220 14.1L224 16L228 17.9L232 19.7L236 21.3L240 22.7' fill='none' stroke='rgba(255,255,255,0.22)' stroke-width='0.6'/%3E%3Cpath d='M0 10.4L4 11.4L8 12.8L12 14.5L16 16.3L20 18.2L24 19.8L28 21L32 21.8L36 22L40 21.6L44 20.6L48 19.2L52 17.5L56 15.7L60 13.8L64 12.2L68 11L72 10.2L76 10L80 10.4L84 11.4L88 12.8L92 14.5L96 16.3L100 18.2L104 19.8L108 21L112 21.8L116 22L120 21.6L124 20.6L128 19.2L132 17.5L136 15.7L140 13.8L144 12.2L148 11L152 10.2L156 10L160 10.4L164 11.4L168 12.8L172 14.5L176 16.3L180 18.2L184 19.8L188 21L192 21.8L196 22L200 21.6L204 20.6L208 19.2L212 17.5L216 15.7L220 13.8L224 12.2L228 11L232 10.2L236 10L240 10.4' fill='none' stroke='rgba(255,255,255,0.12)' stroke-width='0.6'/%3E%3Cpath d='M0 32.6L4 33L8 32.9L12 32.6L16 31.8L20 30.7L24 29.3L28 27.6L32 25.8L36 24L40 22.1L44 20.3L48 18.7L52 17.3L56 16.2L60 15.4L64 15L68 15.1L72 15.4L76 16.2L80 17.3L84 18.7L88 20.4L92 22.2L96 24L100 25.9L104 27.7L108 29.3L112 30.7L116 31.8L120 32.6L124 33L128 32.9L132 32.6L136 31.8L140 30.7L144 29.3L148 27.6L152 25.8L156 24L160 22.1L164 20.3L168 18.7L172 17.3L176 16.2L180 15.4L184 15L188 15.1L192 15.4L196 16.2L200 17.3L204 18.7L208 20.4L212 22.2L216 24L220 25.9L224 27.7L228 29.3L232 30.7L236 31.8L240 32.6' fill='none' stroke='rgba(255,255,255,0.22)' stroke-width='0.6'/%3E%3Cpath d='M0 18.2L4 18L8 18.5L12 19.5L16 20.9L20 22.6L24 24.5L28 26.3L32 27.9L36 29.1L40 29.8L44 30L48 29.5L52 28.5L56 27.1L60 25.4L64 23.5L68 21.7L72 20.1L76 18.9L80 18.2L84 18L88 18.5L92 19.5L96 20.9L100 22.6L104 24.5L108 26.3L112 27.9L116 29.1L120 29.8L124 30L128 29.5L132 28.5L136 27.1L140 25.4L144 23.5L148 21.7L152 20.1L156 18.9L160 18.2L164 18L168 18.5L172 19.5L176 20.9L180 22.6L184 24.5L188 26.3L192 27.9L196 29.1L200 29.8L204 30L208 29.5L212 28.5L216 27.1L220 25.4L224 23.5L228 21.7L232 20.1L236 18.9L240 18.2' fill='none' stroke='rgba(255,255,255,0.12)' stroke-width='0.6'/%3E%3Cpath d='M0 40.9L4 40.5L8 39.8L12 38.7L16 37.3L20 35.6L24 33.8L28 32L32 30.1L36 28.3L40 26.7L44 25.3L48 24.2L52 23.4L56 23L60 23.1L64 23.5L68 24.2L72 25.3L76 26.7L80 28.4L84 30.2L88 32L92 33.9L96 35.7L100 37.3L104 38.7L108 39.8L112 40.6L116 41L120 40.9L124 40.5L128 39.8L132 38.7L136 37.3L140 35.6L144 33.8L148 32L152 30.1L156 28.3L160 26.7L164 25.3L168 24.2L172 23.4L176 23L180 23.1L184 23.5L188 24.2L192 25.3L196 26.7L200 28.4L204 30.2L208 32L212 33.9L216 35.7L220 37.3L224 38.7L228 39.8L232 40.6L236 41L240 40.9' fill='none' stroke='rgba(255,255,255,0.22)' stroke-width='0.6'/%3E%3Cpath d='M0 27.9L4 26.8L8 26.1L12 26L16 26.5L20 27.6L24 29L28 30.8L32 32.7L36 34.5L40 36.1L44 37.2L48 37.9L52 38L56 37.5L60 36.4L64 35L68 33.2L72 31.3L76 29.5L80 27.9L84 26.8L88 26.1L92 26L96 26.5L100 27.6L104 29L108 30.8L112 32.7L116 34.5L120 36.1L124 37.2L128 37.9L132 38L136 37.5L140 36.4L144 35L148 33.2L152 31.3L156 29.5L160 27.9L164 26.8L168 26.1L172 26L176 26.5L180 27.6L184 29L188 30.8L192 32.7L196 34.5L200 36.1L204 37.2L208 37.9L212 38L216 37.5L220 36.4L224 35L228 33.2L232 31.3L236 29.5L240 27.9' fill='none' stroke='rgba(255,255,255,0.12)' stroke-width='0.6'/%3E%3Cpath d='M0 47.8L4 46.7L8 45.2L12 43.6L16 41.8L20 39.9L24 38.1L28 36.3L32 34.7L36 33.3L40 32.2L44 31.4L48 31L52 31.1L56 31.5L60 32.2L64 33.3L68 34.8L72 36.4L76 38.2L80 40.1L84 41.9L88 43.7L92 45.3L96 46.7L100 47.8L104 48.6L108 49L112 48.9L116 48.5L120 47.8L124 46.7L128 45.2L132 43.6L136 41.8L140 39.9L144 38.1L148 36.3L152 34.7L156 33.3L160 32.2L164 31.4L168 31L172 31.1L176 31.5L180 32.2L184 33.3L188 34.8L192 36.4L196 38.2L200 40.1L204 41.9L208 43.7L212 45.3L216 46.7L220 47.8L224 48.6L228 49L232 48.9L236 48.5L240 47.8' fill='none' stroke='rgba(255,255,255,0.22)' stroke-width='0.6'/%3E%3Cpath d='M0 39.2L4 37.4L8 35.8L12 34.7L16 34.1L20 34.1L24 34.6L28 35.7L32 37.2L36 39L40 40.8L44 42.6L48 44.2L52 45.3L56 45.9L60 45.9L64 45.4L68 44.3L72 42.8L76 41L80 39.2L84 37.4L88 35.8L92 34.7L96 34.1L100 34.1L104 34.6L108 35.7L112 37.2L116 39L120 40.8L124 42.6L128 44.2L132 45.3L136 45.9L140 45.9L144 45.4L148 44.3L152 42.8L156 41L160 39.2L164 37.4L168 35.8L172 34.7L176 34.1L180 34.1L184 34.6L188 35.7L192 37.2L196 39L200 40.8L204 42.6L208 44.2L212 45.3L216 45.9L220 45.9L224 45.4L228 44.3L232 42.8L236 41L240 39.2' fill='none' stroke='rgba(255,255,255,0.12)' stroke-width='0.6'/%3E%3Cpath d='M0 53.2L4 51.6L8 49.8L12 47.9L16 46.1L20 44.3L24 42.7L28 41.3L32 40.2L36 39.4L40 39L44 39.1L48 39.5L52 40.2L56 41.4L60 42.8L64 44.4L68 46.2L72 48.1L76 49.9L80 51.7L84 53.3L88 54.7L92 55.8L96 56.6L100 57L104 56.9L108 56.5L112 55.8L116 54.6L120 53.2L124 51.6L128 49.8L132 47.9L136 46.1L140 44.3L144 42.7L148 41.3L152 40.2L156 39.4L160 39L164 39.1L168 39.5L172 40.2L176 41.4L180 42.8L184 44.4L188 46.2L192 48.1L196 49.9L200 51.7L204 53.3L208 54.7L212 55.8L216 56.6L220 57L224 56.9L228 56.5L232 55.8L236 54.6L240 53.2' fill='none' stroke='rgba(255,255,255,0.22)' stroke-width='0.6'/%3E%3Cpath d='M0 50.7L4 48.9L8 47L12 45.2L16 43.7L20 42.6L24 42.1L28 42.1L32 42.7L36 43.8L40 45.3L44 47.1L48 49L52 50.8L56 52.3L60 53.4L64 53.9L68 53.9L72 53.3L76 52.2L80 50.7L84 48.9L88 47L92 45.2L96 43.7L100 42.6L104 42.1L108 42.1L112 42.7L116 43.8L120 45.3L124 47.1L128 49L132 50.8L136 52.3L140 53.4L144 53.9L148 53.9L152 53.3L156 52.2L160 50.7L164 48.9L168 47L172 45.2L176 43.7L180 42.6L184 42.1L188 42.1L192 42.7L196 43.8L200 45.3L204 47.1L208 49L212 50.8L216 52.3L220 53.4L224 53.9L228 53.9L232 53.3L236 52.2L240 50.7' fill='none' stroke='rgba(255,255,255,0.12)' stroke-width='0.6'/%3E%3Cpath d='M0 57.8L4 55.9L8 54.1L12 52.3L16 50.7L20 49.3L24 48.2L28 47.4L32 47L36 47.1L40 47.5L44 48.2L48 49.4L52 50.8L56 52.4L60 54.2L64 56.1L68 57.9L72 59.7L76 61.3L80 62.7L84 63.8L88 64.6L92 65L96 64.9L100 64.5L104 63.8L108 62.6L112 61.2L116 59.6L120 57.8L124 55.9L128 54.1L132 52.3L136 50.7L140 49.3L144 48.2L148 47.4L152 47L156 47.1L160 47.5L164 48.2L168 49.4L172 50.8L176 52.4L180 54.2L184 56.1L188 57.9L192 59.7L196 61.3L200 62.7L204 63.8L208 64.6L212 65L216 64.9L220 64.5L224 63.8L228 62.6L232 61.2L236 59.6L240 57.8' fill='none' stroke='rgba(255,255,255,0.22)' stroke-width='0.6'/%3E%3Cpath d='M0 61.2L4 60.1L8 58.5L12 56.7L16 54.8L20 53.1L24 51.6L28 50.5L32 50L36 50.1L40 50.8L44 51.9L48 53.5L52 55.3L56 57.2L60 58.9L64 60.4L68 61.5L72 62L76 61.9L80 61.2L84 60.1L88 58.5L92 56.7L96 54.8L100 53.1L104 51.6L108 50.5L112 50L116 50.1L120 50.8L124 51.9L128 53.5L132 55.3L136 57.2L140 58.9L144 60.4L148 61.5L152 62L156 61.9L160 61.2L164 60.1L168 58.5L172 56.7L176 54.8L180 53.1L184 51.6L188 50.5L192 50L196 50.1L200 50.8L204 51.9L208 53.5L212 55.3L216 57.2L220 58.9L224 60.4L228 61.5L232 62L236 61.9L240 61.2' fill='none' stroke='rgba(255,255,255,0.12)' stroke-width='0.6'/%3E%3Cpath d='M0 62L4 60.3L8 58.6L12 57.3L16 56.2L20 55.4L24 55L28 55.1L32 55.5L36 56.2L40 57.4L44 58.8L48 60.4L52 62.2L56 64.1L60 66L64 67.7L68 69.4L72 70.7L76 71.8L80 72.6L84 73L88 72.9L92 72.5L96 71.8L100 70.6L104 69.2L108 67.6L112 65.8L116 63.9L120 62L124 60.3L128 58.6L132 57.3L136 56.2L140 55.4L144 55L148 55.1L152 55.5L156 56.2L160 57.4L164 58.8L168 60.4L172 62.2L176 64.1L180 66L184 67.7L188 69.4L192 70.7L196 71.8L200 72.6L204 73L208 72.9L212 72.5L216 71.8L220 70.6L224 69.2L228 67.6L232 65.8L236 63.9L240 62' fill='none' stroke='rgba(255,255,255,0.22)' stroke-width='0.6'/%3E%3Cpath d='M0 70L4 69.8L8 69.1L12 67.9L16 66.3L20 64.5L24 62.7L28 60.9L32 59.5L36 58.5L40 58L44 58.2L48 58.9L52 60.1L56 61.7L60 63.5L64 65.3L68 67.1L72 68.5L76 69.5L80 70L84 69.8L88 69.1L92 67.9L96 66.3L100 64.5L104 62.7L108 60.9L112 59.5L116 58.5L120 58L124 58.2L128 58.9L132 60.1L136 61.7L140 63.5L144 65.3L148 67.1L152 68.5L156 69.5L160 70L164 69.8L168 69.1L172 67.9L176 66.3L180 64.5L184 62.7L188 60.9L192 59.5L196 58.5L200 58L204 58.2L208 58.9L212 60.1L216 61.7L220 63.5L224 65.3L228 67.1L232 68.5L236 69.5L240 70' fill='none' stroke='rgba(255,255,255,0.12)' stroke-width='0.6'/%3E%3Cpath d='M0 66.6L4 65.3L8 64.2L12 63.4L16 63L20 63.1L24 63.5L28 64.3L32 65.4L36 66.8L40 68.4L44 70.2L48 72.1L52 74L56 75.7L60 77.4L64 78.7L68 79.8L72 80.6L76 81L80 80.9L84 80.5L88 79.7L92 78.6L96 77.2L100 75.6L104 73.8L108 71.9L112 70L116 68.3L120 66.6L124 65.3L128 64.2L132 63.4L136 63L140 63.1L144 63.5L148 64.3L152 65.4L156 66.8L160 68.4L164 70.2L168 72.1L172 74L176 75.7L180 77.4L184 78.7L188 79.8L192 80.6L196 81L200 80.9L204 80.5L208 79.7L212 78.6L216 77.2L220 75.6L224 73.8L228 71.9L232 70L236 68.3L240 66.6' fill='none' stroke='rgba(255,255,255,0.22)' stroke-width='0.6'/%3E%3Cpath d='M0 76.6L4 77.6L8 78L12 77.8L16 77.1L20 75.8L24 74.2L28 72.4L32 70.5L36 68.8L40 67.4L44 66.4L48 66L52 66.2L56 66.9L60 68.2L64 69.8L68 71.6L72 73.5L76 75.2L80 76.6L84 77.6L88 78L92 77.8L96 77.1L100 75.8L104 74.2L108 72.4L112 70.5L116 68.8L120 67.4L124 66.4L128 66L132 66.2L136 66.9L140 68.2L144 69.8L148 71.6L152 73.5L156 75.2L160 76.6L164 77.6L168 78L172 77.8L176 77.1L180 75.8L184 74.2L188 72.4L192 70.5L196 68.8L200 67.4L204 66.4L208 66L212 66.2L216 66.9L220 68.2L224 69.8L228 71.6L232 73.5L236 75.2L240 76.6' fill='none' stroke='rgba(255,255,255,0.12)' stroke-width='0.6'/%3E%3Cpath d='M0 72.2L4 71.4L8 71L12 71.1L16 71.5L20 72.3L24 73.4L28 74.8L32 76.4L36 78.2L40 80.1L44 82L48 83.8L52 85.4L56 86.8L60 87.8L64 88.6L68 89L72 88.9L76 88.5L80 87.7L84 86.6L88 85.2L92 83.6L96 81.8L100 79.9L104 78L108 76.2L112 74.6L116 73.2L120 72.2L124 71.4L128 71L132 71.1L136 71.5L140 72.3L144 73.4L148 74.8L152 76.4L156 78.2L160 80.1L164 82L168 83.8L172 85.4L176 86.8L180 87.8L184 88.6L188 89L192 88.9L196 88.5L200 87.7L204 86.6L208 85.2L212 83.6L216 81.8L220 79.9L224 78L228 76.2L232 74.6L236 73.2L240 72.2' fill='none' stroke='rgba(255,255,255,0.22)' stroke-width='0.6'/%3E%3Cpath d='M0 81.7L4 83.4L8 84.7L12 85.6L16 86L20 85.8L24 85L28 83.7L32 82L36 80.2L40 78.3L44 76.6L48 75.3L52 74.4L56 74L60 74.2L64 75L68 76.3L72 78L76 79.8L80 81.7L84 83.4L88 84.7L92 85.6L96 86L100 85.8L104 85L108 83.7L112 82L116 80.2L120 78.3L124 76.6L128 75.3L132 74.4L136 74L140 74.2L144 75L148 76.3L152 78L156 79.8L160 81.7L164 83.4L168 84.7L172 85.6L176 86L180 85.8L184 85L188 83.7L192 82L196 80.2L200 78.3L204 76.6L208 75.3L212 74.4L216 74L220 74.2L224 75L228 76.3L232 78L236 79.8L240 81.7' fill='none' stroke='rgba(255,255,255,0.12)' stroke-width='0.6'/%3E%3Cpath d='M0 79L4 79.1L8 79.5L12 80.3L16 81.4L20 82.8L24 84.4L28 86.2L32 88.1L36 90L40 91.8L44 93.4L48 94.8L52 95.8L56 96.6L60 97L64 96.9L68 96.5L72 95.7L76 94.6L80 93.2L84 91.6L88 89.8L92 87.9L96 86L100 84.2L104 82.6L108 81.2L112 80.2L116 79.4L120 79L124 79.1L128 79.5L132 80.3L136 81.4L140 82.8L144 84.4L148 86.2L152 88.1L156 90L160 91.8L164 93.4L168 94.8L172 95.8L176 96.6L180 97L184 96.9L188 96.5L192 95.7L196 94.6L200 93.2L204 91.6L208 89.8L212 87.9L216 86L220 84.2L224 82.6L228 81.2L232 80.2L236 79.4L240 79' fill='none' stroke='rgba(255,255,255,0.22)' stroke-width='0.6'/%3E%3Cpath d='M0 86.1L4 88L8 89.8L12 91.5L16 92.8L20 93.7L24 94L28 93.7L32 92.9L36 91.5L40 89.9L44 88L48 86.2L52 84.5L56 83.2L60 82.3L64 82L68 82.3L72 83.1L76 84.5L80 86.1L84 88L88 89.8L92 91.5L96 92.8L100 93.7L104 94L108 93.7L112 92.9L116 91.5L120 89.9L124 88L128 86.2L132 84.5L136 83.2L140 82.3L144 82L148 82.3L152 83.1L156 84.5L160 86.1L164 88L168 89.8L172 91.5L176 92.8L180 93.7L184 94L188 93.7L192 92.9L196 91.5L200 89.9L204 88L208 86.2L212 84.5L216 83.2L220 82.3L224 82L228 82.3L232 83.1L236 84.5L240 86.1' fill='none' stroke='rgba(255,255,255,0.12)' stroke-width='0.6'/%3E%3Cpath d='M0 87.5L4 88.3L8 89.4L12 90.8L16 92.5L20 94.2L24 96.1L28 98L32 99.8L36 101.4L40 102.8L44 103.9L48 104.6L52 105L56 104.9L60 104.5L64 103.7L68 102.6L72 101.2L76 99.5L80 97.8L84 95.9L88 94L92 92.2L96 90.6L100 89.2L104 88.1L108 87.4L112 87L116 87.1L120 87.5L124 88.3L128 89.4L132 90.8L136 92.5L140 94.2L144 96.1L148 98L152 99.8L156 101.4L160 102.8L164 103.9L168 104.6L172 105L176 104.9L180 104.5L184 103.7L188 102.6L192 101.2L196 99.5L200 97.8L204 95.9L208 94L212 92.2L216 90.6L220 89.2L224 88.1L228 87.4L232 87L236 87.1L240 87.5' fill='none' stroke='rgba(255,255,255,0.22)' stroke-width='0.6'/%3E%3Cpath d='M0 91.2L4 92.6L8 94.3L12 96.2L16 98L20 99.7L24 100.9L28 101.8L32 102L36 101.7L40 100.8L44 99.4L48 97.7L52 95.8L56 94L60 92.3L64 91.1L68 90.2L72 90L76 90.3L80 91.2L84 92.6L88 94.3L92 96.2L96 98L100 99.7L104 100.9L108 101.8L112 102L116 101.7L120 100.8L124 99.4L128 97.7L132 95.8L136 94L140 92.3L144 91.1L148 90.2L152 90L156 90.3L160 91.2L164 92.6L168 94.3L172 96.2L176 98L180 99.7L184 100.9L188 101.8L192 102L196 101.7L200 100.8L204 99.4L208 97.7L212 95.8L216 94L220 92.3L224 91.1L228 90.2L232 90L236 90.3L240 91.2' fill='none' stroke='rgba(255,255,255,0.12)' stroke-width='0.6'/%3E%3Cpath d='M0 97.4L4 98.8L8 100.5L12 102.3L16 104.1L20 106L24 107.8L28 109.4L32 110.8L36 111.9L40 112.6L44 113L48 112.9L52 112.5L56 111.7L60 110.6L64 109.2L68 107.5L72 105.7L76 103.9L80 102L84 100.2L88 98.6L92 97.2L96 96.1L100 95.4L104 95L108 95.1L112 95.5L116 96.3L120 97.4L124 98.8L128 100.5L132 102.3L136 104.1L140 106L144 107.8L148 109.4L152 110.8L156 111.9L160 112.6L164 113L168 112.9L172 112.5L176 111.7L180 110.6L184 109.2L188 107.5L192 105.7L196 103.9L200 102L204 100.2L208 98.6L212 97.2L216 96.1L220 95.4L224 95L228 95.1L232 95.5L236 96.3L240 97.4' fill='none' stroke='rgba(255,255,255,0.22)' stroke-width='0.6'/%3E%3Cpath d='M0 98L4 98.4L8 99.3L12 100.7L16 102.5L20 104.3L24 106.2L28 107.8L32 109L36 109.8L40 110L44 109.6L48 108.7L52 107.3L56 105.5L60 103.7L64 101.8L68 100.2L72 99L76 98.2L80 98L84 98.4L88 99.3L92 100.7L96 102.5L100 104.3L104 106.2L108 107.8L112 109L116 109.8L120 110L124 109.6L128 108.7L132 107.3L136 105.5L140 103.7L144 101.8L148 100.2L152 99L156 98.2L160 98L164 98.4L168 99.3L172 100.7L176 102.5L180 104.3L184 106.2L188 107.8L192 109L196 109.8L200 110L204 109.6L208 108.7L212 107.3L216 105.5L220 103.7L224 101.8L228 100.2L232 99L236 98.2L240 98' fill='none' stroke='rgba(255,255,255,0.12)' stroke-width='0.6'/%3E%3Cpath d='M0 108.5L4 110.3L8 112.1L12 114L16 115.8L20 117.4L24 118.8L28 119.9L32 120.6L36 121L40 120.9L44 120.5L48 119.7L52 118.6L56 117.2L60 115.5L64 113.7L68 111.9L72 110L76 108.2L80 106.6L84 105.2L88 104.1L92 103.4L96 103L100 103.1L104 103.5L108 104.3L112 105.4L116 106.8L120 108.5L124 110.3L128 112.1L132 114L136 115.8L140 117.4L144 118.8L148 119.9L152 120.6L156 121L160 120.9L164 120.5L168 119.7L172 118.6L176 117.2L180 115.5L184 113.7L188 111.9L192 110L196 108.2L200 106.6L204 105.2L208 104.1L212 103.4L216 103L220 103.1L224 103.5L228 104.3L232 105.4L236 106.8L240 108.5' fill='none' stroke='rgba(255,255,255,0.22)' stroke-width='0.6'/%3E%3Cpath d='M0 106.9L4 106.2L8 106L12 106.5L16 107.5L20 108.9L24 110.6L28 112.5L32 114.3L36 115.9L40 117.1L44 117.8L48 118L52 117.5L56 116.5L60 115.1L64 113.4L68 111.5L72 109.7L76 108.1L80 106.9L84 106.2L88 106L92 106.5L96 107.5L100 108.9L104 110.6L108 112.5L112 114.3L116 115.9L120 117.1L124 117.8L128 118L132 117.5L136 116.5L140 115.1L144 113.4L148 111.5L152 109.7L156 108.1L160 106.9L164 106.2L168 106L172 106.5L176 107.5L180 108.9L184 110.6L188 112.5L192 114.3L196 115.9L200 117.1L204 117.8L208 118L212 117.5L216 116.5L220 115.1L224 113.4L228 111.5L232 109.7L236 108.1L240 106.9' fill='none' stroke='rgba(255,255,255,0.12)' stroke-width='0.6'/%3E%3C/svg%3E");
}
/*/@textures*/

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--nav-height) + 16px); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0;
  background: var(--texture-grain), var(--bg-canvas);
  color: var(--text-muted);
  font: var(--font-weight-regular) var(--text-body)/var(--leading-body) var(--font-sans);
  letter-spacing: var(--tracking-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: clip;
}
h1, h2, h3, p, ol, ul, dl, dd, figure { margin: 0; }
ol, ul { padding: 0; list-style: none; }
a { color: inherit; }
img, svg { display: block; max-width: 100%; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--color-sky-signal); outline-offset: 3px; }
::selection { background: var(--data-ice); color: var(--text-strong); }

.skip { position: absolute; left: 16px; top: -60px; z-index: 100; padding: 8px 12px; background: var(--action-bg); color: var(--action-fg); font: 12px var(--font-mono); text-decoration: none; }
.skip:focus { top: 16px; }

/* Mobile: 16px total side gutter (8px to the frame line + 8px inset). */
@media (max-width: 639px) {
  :root { --frame-gutter: 8px; --content-inset: 8px; }
}

/* ---------- Frame + bands ---------- */
.wrap {
  position: relative;
  max-width: var(--page-max-width);
  margin-inline: auto;
  padding-inline: calc(var(--frame-gutter) + var(--content-inset));
}
.wrap::before { /* the dashed construction frame */
  content: ""; position: absolute; inset: 0 var(--frame-gutter);
  border-inline: 1px dashed var(--frame-line, var(--color-blueprint-gray));
  pointer-events: none;
}
.band { position: relative; }
.band--paper { border-bottom: var(--border-section); }
.band--cool { background: var(--texture-grain), var(--bg-band-cool); --frame-line: #b9bbc6; }
.band--brand { background: var(--bg-band-brand); color: var(--text-on-dark-muted); --frame-line: rgba(255, 255, 255, 0.2); }
.band--dark { background: var(--bg-band-dark); color: var(--text-on-dark-muted); --frame-line: rgba(255, 255, 255, 0.14); }

/* ---------- Type ---------- */
.display, .h2, .h3, .cta__h2, .stat__num, .tier__size, .card, .step__title, .wordmark, .footer__watermark, .ring__mark, .fcol__title, .tab, .dev span {
  font-family: var(--font-display-free);
  font-weight: var(--font-weight-regular);
}
.display {
  max-width: 1000px; margin-inline: auto;
  font-size: var(--text-display); line-height: var(--leading-display); letter-spacing: var(--tracking-display);
  color: var(--text-strong); text-wrap: balance;
}
.h2 {
  font-size: var(--text-heading-lg); line-height: var(--leading-heading-lg); letter-spacing: -0.035em;
  color: var(--text-strong); text-wrap: balance;
}
.band--brand .h2, .band--dark .h2 { color: var(--text-on-dark); }
.h2 .s, .display .s { display: inline-block; }
.h3 {
  font-size: var(--text-heading); line-height: var(--leading-heading); letter-spacing: var(--tracking-heading);
  color: var(--text-strong); text-wrap: balance;
}
.chip {
  display: inline-block;
  font: var(--font-weight-regular) var(--text-caption)/var(--leading-caption) var(--font-mono);
  letter-spacing: var(--tracking-caption); text-transform: uppercase;
  color: var(--text-eyebrow); border: var(--border-chip); padding: 4px 8px;
}
.chip--dark { color: var(--text-eyebrow-on-dark); border: var(--border-chip-on-dark); }
.step-label {
  display: block; font: var(--font-weight-medium) var(--text-label)/var(--leading-label) var(--font-sans);
  letter-spacing: var(--tracking-label); text-transform: uppercase; color: var(--text-eyebrow);
}
/* Review markers from the copy file ([confirm], [needs ...]) */
.tag {
  display: inline-block; vertical-align: 0.2em;
  font: var(--font-weight-medium) 11px/1.2 var(--font-mono); letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--color-fog-gray); border: 1px dashed currentColor; padding: 2px 5px; white-space: nowrap;
}
.tag--dark { color: rgba(255, 255, 255, 0.45); }

/* ---------- Buttons ---------- */
.btn {
  position: relative; overflow: hidden;
  display: inline-flex; align-items: center; justify-content: center;
  width: 260px; max-width: 100%; height: 53px; padding: 20px 24px;
  background: var(--action-bg); color: var(--action-fg); text-decoration: none;
  font: var(--font-weight-medium) 16px/1 var(--font-display-free); letter-spacing: 0.01em;
  transition: transform var(--duration-instant) var(--ease-snap);
  -webkit-tap-highlight-color: transparent;
}
.btn::before { /* faint line pattern that drifts on hover */
  content: ""; position: absolute; inset: 0 -16px 0 -16px;
  background: repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.07) 0 1px, transparent 1px 8px);
  opacity: 0; transition: opacity var(--duration-fast) var(--ease-out), transform 1.2s linear;
}
.btn > span { position: relative; }
@media (hover: hover) { .btn:hover::before { opacity: 1; transform: translateX(16px); } }
.btn:active { transform: scale(var(--press-scale)); }
.btn--sm { width: auto; height: 40px; padding: 12px 20px; font-size: 13px; }
.btn-outline {
  min-width: 64px; min-height: 32px; padding: 4px 12px;
  background: transparent; border: var(--action-outline); border-radius: 0;
  font: var(--font-weight-medium) 12px/1 var(--font-sans); color: var(--color-ink-black); cursor: pointer;
  transition: transform var(--duration-instant) var(--ease-snap);
}
.btn-outline:active { transform: scale(0.98); }

/* ---------- 0. Nav ---------- */
.nav {
  position: fixed; inset: 0 0 auto; z-index: 50;
  padding: 16px var(--frame-gutter) 0;
  transition: padding var(--duration-fast) var(--ease-in-out-sine);
}
.nav__inner {
  position: relative;
  max-width: calc(var(--page-max-width) - 2 * var(--frame-gutter)); margin-inline: auto;
  height: var(--nav-height); padding-inline: calc(var(--content-inset) - 1px);
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  border: 1px solid transparent;
  transition: background-color var(--duration-fast) var(--ease-in-out-sine), border-color var(--duration-fast) var(--ease-in-out-sine);
}
.nav.is-docked { padding-top: 0; }
.nav.is-docked .nav__inner, .nav.is-open .nav__inner {
  border-color: var(--color-tab-gray);
  background: var(--texture-grain), rgba(252, 252, 252, 0.88);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
}
.wordmark {
  font-size: 26px; line-height: 1; letter-spacing: -0.035em; color: var(--text-strong); text-decoration: none;
}
.nav__links { display: flex; gap: 24px; margin-left: auto; }
.nav__links a {
  font: var(--font-weight-regular) var(--text-body-sm)/var(--leading-body-sm) var(--font-sans); letter-spacing: var(--tracking-body-sm);
  color: var(--color-nav-gray); text-decoration: none; transition: color var(--duration-instant) var(--ease-standard);
}
.nav__links a:hover { color: var(--color-ink-black); }
.nav__actions { display: flex; align-items: center; gap: 12px; }
.nav__menu { display: none; }
@media (max-width: 1023px) {
  .nav__menu { display: inline-flex; align-items: center; justify-content: center; }
  .nav__links {
    position: absolute; top: calc(100% + 1px); left: -1px; right: -1px;
    flex-direction: column; gap: 0; padding: 8px calc(var(--content-inset) - 1px) 16px;
    background: var(--texture-grain), var(--bg-canvas); border: 1px solid var(--color-tab-gray); border-top: 0;
    visibility: hidden; opacity: 0; transform: translateY(-6px);
    transition: opacity var(--duration-fast) var(--ease-out), transform var(--duration-fast) var(--ease-out), visibility 0s linear var(--duration-fast);
  }
  .nav.is-open .nav__links { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
  .nav__links a { padding: 12px 0; border-bottom: var(--border-faq); font-size: 16px; color: var(--color-ink-black); }
  .nav__links a:last-child { border-bottom: 0; }
}
@media (max-width: 399px) { .wordmark { font-size: 22px; } .nav__actions { gap: 8px; } .btn--sm { padding-inline: 14px; } }

/* ---------- 1. Hero ---------- */
.hero > .wrap { padding-top: calc(var(--nav-height) + 16px + clamp(56px, 8vw, 120px)); }
.hero__copy { text-align: center; }
.hero__sub { max-width: var(--content-narrow); margin: 24px auto 40px; text-wrap: pretty; }
.hero__figure { position: relative; margin: clamp(48px, 6vw, 80px) auto 0; max-width: 1216px; }
.illo--hero-m { display: none; }
.callout {
  position: absolute; left: var(--x); top: var(--y); transform: translateY(-50%);
  display: grid; gap: 2px; white-space: nowrap;
}
.callout--l { transform: translate(-100%, -50%); text-align: right; }
.callout__name { font: var(--font-weight-medium) 14px/1.2 var(--font-sans); letter-spacing: -0.02em; color: var(--color-ink-black); }
.callout__kind { font: var(--font-weight-regular) 11px/1.4 var(--font-mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-fog-gray); }
@media (max-width: 767px) {
  .illo--hero-d { display: none; }
  .illo--hero-m { display: block; width: 100%; }
  .callout, .callout--l { left: var(--mx); top: var(--my); transform: translateY(-50%); text-align: left; }
  .callout__name { font-size: 12px; }
  .callout__kind { font-size: 11px; letter-spacing: 0; max-width: calc(100vw - var(--mx) - 20px); white-space: normal; }
  .callout { background: var(--bg-canvas); padding: 2px 4px 2px 2px; }
}
.hud {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px;
  padding: 28px 0 24px;
  font: var(--font-weight-regular) var(--text-micro)/var(--leading-micro) var(--font-mono);
  letter-spacing: var(--tracking-micro); text-transform: uppercase; color: var(--color-fog-gray);
}
.hud__process { display: flex; gap: 8px; }
.hud__process li:not(:last-child)::after { content: "→"; margin-left: 8px; }
.hud__code { border: 1px dashed var(--color-blueprint-gray); padding: 2px 6px; }
@media (max-width: 639px) { .hud { justify-content: flex-start; } .hud__class { width: 100%; } .hero__copy .btn { width: 100%; } }

.barcode-band { border-bottom: var(--border-section); }
.barcode { width: 100%; height: 20px; }

/* ---------- 2. Stats ---------- */
.stats__row { display: grid; grid-template-columns: 1fr 1fr; margin-inline: calc(-1 * var(--content-inset)); }
.stat { padding: 40px 24px; padding-left: var(--content-inset); }
.stat + .stat { border-left: var(--border-grid); padding-left: calc(var(--content-inset) + 24px); }
.stat__num { font-size: var(--text-display-alt); line-height: var(--leading-display-alt); letter-spacing: var(--tracking-display-alt); color: #2a2a2a; }
.stat__cap { margin-top: 24px; color: var(--text-muted); }
@media (max-width: 639px) { .stat { padding: 32px 12px 32px var(--content-inset); } .stat + .stat { padding-left: 16px; } .stat__cap { margin-top: 12px; } }

/* ---------- 6. Proof: brand logo wall ---------- */
.brands { margin-top: 40px; }
.brands__cap { font: var(--font-weight-medium) 12px/1.35 var(--font-mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-fog-gray); }
.brands__row { display: grid; grid-template-columns: repeat(6, 1fr); margin: 16px calc(-1 * var(--content-inset)) 48px; border-block: var(--border-grid); }
.brand { display: grid; grid-template-rows: 1fr auto; justify-items: center; align-items: center; gap: 14px; min-height: 140px; padding: 28px 16px 16px; }
.brand:not(:nth-child(6n)) { border-right: var(--border-section); }
.brand:nth-child(n+7) { border-top: var(--border-section); }
.brand img { display: block; width: auto; height: 26px; max-width: 80%; object-fit: contain; filter: grayscale(1) brightness(0.2); }
.brand--xiaomi img { height: 40px; }
.brand--supor img { height: 30px; }
.brand--huawei img { height: 22px; }
.brand--xun img { height: 34px; }
.brand--zepp img { height: 22px; }
.brand--1more img { height: 22px; }
.brand--dreame img { height: 18px; }
.brand--facebook img { height: 22px; }
.brand--logitech img { height: 30px; }
.brand span { font: 11px/1.3 var(--font-mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-fog-gray); text-align: center; }
@media (max-width: 639px) {
  .brands__row { grid-template-columns: repeat(2, 1fr); }
  .brand { min-height: 112px; border-right: 0 !important; border-top: 0 !important; border-bottom: var(--border-section); }
  .brand:nth-child(odd) { border-right: var(--border-section) !important; }
  .brand:nth-last-child(-n+2) { border-bottom: 0; }
}
.products__row { display: grid; grid-template-columns: repeat(4, 1fr); margin: 16px calc(-1 * var(--content-inset)) 48px; border-block: var(--border-grid); }
.product { display: flex; flex-direction: column; justify-content: space-between; gap: 28px; min-height: 120px; padding: 20px 16px 20px var(--content-inset); }
.product:not(:nth-child(4n+1)) { border-left: var(--border-section); padding-left: 24px; }
.product:nth-child(n+5) { border-top: var(--border-section); }
.product--next .product__name { color: var(--color-fog-gray); text-decoration: none; }
.product--next .product__name:hover { color: var(--color-headline-black); }
.product__idx { font: 11px/1.3 var(--font-mono); letter-spacing: 0.06em; color: var(--color-fog-gray); }
.product__name { font: var(--font-weight-regular) 24px/1.15 var(--font-display-free); letter-spacing: -0.01em; color: var(--color-headline-black); }
@media (max-width: 639px) {
  .products__row { grid-template-columns: repeat(2, 1fr); }
  .product { min-height: 96px; padding-left: var(--content-inset) !important; border-top: 0 !important; border-left: 0 !important; }
  .product:nth-child(even) { border-left: var(--border-section) !important; }
  .product:not(:nth-last-child(-n+2)) { border-bottom: var(--border-section); }
}
.panel__link { display: inline-flex; gap: 6px; margin-top: 20px; font: var(--font-weight-medium) 12px/1.35 var(--font-mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-ink-black); text-decoration: underline; text-underline-offset: 4px; }

/* ---------- 6b. Nowa case study ---------- */
.nowa > .wrap { padding-block: var(--section-pad-y); }
.case { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); border: 1px solid var(--color-ink-black); background: var(--bg-canvas); }
.case__photo { margin: 0; border-right: 1px solid var(--color-ink-black); }
.case__photo img { display: block; width: 100%; height: 100%; max-height: 640px; object-fit: cover; }
.case__body { display: grid; align-content: start; gap: 22px; padding: clamp(24px, 4vw, 56px); }
.case__top { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.nowa__mark { width: 104px; height: auto; }
.nowa__mark path { fill: var(--color-ink-black); } /* the v0.7 mark was drawn for a dark card */
.case__lead { color: var(--text-muted); max-width: 520px; }
.case__quote { margin: 0; padding-left: 18px; border-left: 2px solid var(--color-signal-blue); }
.case__quote blockquote { margin: 0; font: var(--font-weight-regular) var(--text-heading-sm)/var(--leading-heading-sm) var(--font-display-free); letter-spacing: var(--tracking-heading-sm); color: var(--text-strong); }
.case__quote figcaption { margin-top: 8px; font: 11px/1.4 var(--font-mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-fog-gray); }
.case__stats { display: grid; grid-template-columns: 1fr 1fr; border-top: var(--border-grid); }
.case__stats > div { padding: 18px 16px 0 0; }
.case__stats > div + div { padding-left: 16px; border-left: var(--border-section); }
.case__stats dt { font: var(--font-weight-regular) var(--text-heading-md, 32px)/1.1 var(--font-display-free); letter-spacing: -0.02em; color: var(--text-strong); }
.case__stats dd { margin: 8px 0 0; color: var(--text-muted); text-wrap: pretty; }
.case__more { margin-top: 0; border: 1px solid var(--color-ink-black); border-top: 0; }
.case__more summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px clamp(20px, 3vw, 28px); cursor: pointer; list-style: none; font: var(--font-weight-medium) 12px/1.35 var(--font-mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-ink-black); }
.case__more summary::-webkit-details-marker { display: none; }
.case__more summary:hover { background: var(--bg-card-hatched); }
.case__more summary:focus-visible { outline: 2px solid var(--color-signal-blue); outline-offset: -2px; }
.case__more summary i { position: relative; width: 12px; height: 12px; }
.case__more summary i::before, .case__more summary i::after { content: ""; position: absolute; inset: 5px 0 auto; height: 1.5px; background: currentColor; transition: transform var(--duration-fast) var(--ease-out); }
.case__more summary i::after { transform: rotate(90deg); }
.case__more[open] summary i::after { transform: rotate(0deg); }
.case__close, .case__more[open] .case__open { display: none; }
.case__more[open] .case__close { display: inline; }
.case__detail { padding: 0 clamp(20px, 3vw, 28px) clamp(24px, 4vw, 40px); border-top: var(--border-section); }
.case__gallery { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; margin-top: 24px; }
.case__gallery img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; border: 1px solid var(--color-rule-gray, #e2e2e2); }
.case__cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; margin-top: 32px; }
.case__h { margin-bottom: 10px; font: var(--font-weight-medium) 12px/1.35 var(--font-mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-signal-blue); }
.case__cols p, .case__steps { color: var(--text-muted); text-wrap: pretty; }
.case__steps { display: grid; gap: 8px; counter-reset: s; }
.case__steps li { counter-increment: s; display: grid; grid-template-columns: 24px 1fr; }
.case__steps li::before { content: counter(s, decimal-leading-zero); font: 11px/1.9 var(--font-mono); color: var(--color-fog-gray); }
@media (max-width: 1023px) {
  .case { grid-template-columns: 1fr; }
  .case__photo { border-right: 0; border-bottom: 1px solid var(--color-ink-black); }
  .case__photo img { max-height: 420px; object-position: center 40%; }
  .case__gallery { grid-template-columns: repeat(3, 1fr); }
  .case__gallery li:nth-child(n+4) { display: none; }
  .case__cols { grid-template-columns: 1fr; gap: 24px; }
}
@media (max-width: 639px) { .case__stats { grid-template-columns: 1fr; } .case__stats > div + div { padding-left: 0; border-left: 0; } }

/* ---------- 9b. Contact ---------- */
.contact > .wrap { padding-block: var(--section-pad-y); }
.contact__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--grid-gap); align-items: start; }
.contact__head { display: grid; gap: 24px; justify-items: start; }
.contact__intro { max-width: 420px; color: var(--text-muted); text-wrap: pretty; }
.contact__who { display: grid; gap: 12px; margin-top: 8px; }
.contact__who li { display: grid; grid-template-columns: 44px 1fr; gap: 12px; align-items: center; }
.contact__who img { width: 44px; height: 44px; object-fit: cover; object-position: center 20%; filter: grayscale(1); border: 1px solid var(--color-ink-black); }
.contact__who span { display: grid; gap: 2px; font: 11px/1.4 var(--font-mono); letter-spacing: 0.04em; text-transform: uppercase; color: var(--color-fog-gray); }
.contact__who b { font: var(--font-weight-medium) 15px/1.2 var(--font-sans); letter-spacing: -0.01em; text-transform: none; color: var(--color-ink-black); }
.cform, .cform__done { display: grid; gap: 20px; padding: clamp(24px, 3vw, 40px); border: 1px solid var(--color-ink-black); background: var(--texture-grain), var(--color-paper-white); }
.cform__row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.field { display: grid; gap: 8px; min-width: 0; margin: 0; padding: 0; border: 0; }
.field__label { font: var(--font-weight-medium) 11px/1.4 var(--font-mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-ink-black); }
.field__label i { font-style: normal; color: var(--color-signal-blue); }
.field input, .field textarea {
  width: 100%; padding: 12px 14px; border: 1px solid var(--color-blueprint-gray); border-radius: 0; background: #fff;
  font: 16px/1.4 var(--font-sans); color: var(--color-ink-black); transition: border-color var(--duration-fast) var(--ease-out);
}
.field textarea { resize: vertical; min-height: 120px; }
.field input::placeholder, .field textarea::placeholder { color: #8a8a8a; }
.field input:focus-visible, .field textarea:focus-visible { outline: 2px solid var(--color-signal-blue); outline-offset: -1px; border-color: var(--color-ink-black); }
.field [aria-invalid="true"] { border-color: #c2361b; }
.field__err { min-height: 0; font: 12px/1.4 var(--font-sans); color: #b3301a; }
.field__err:empty { display: none; }
.field--pref legend { padding: 0; margin-bottom: 8px; }
.pills { display: flex; flex-wrap: wrap; gap: 8px; }
.pill { position: relative; cursor: pointer; }
.pill input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.pill span { display: inline-block; padding: 9px 16px; border: 1px solid var(--color-blueprint-gray); font: var(--font-weight-medium) 12px/1 var(--font-mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-ink-black); background: #fff; transition: background var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out); }
.pill input:checked + span { background: var(--color-ink-black); border-color: var(--color-ink-black); color: #fff; }
.pill input:focus-visible + span { outline: 2px solid var(--color-signal-blue); outline-offset: 2px; }
.cform__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; margin-top: 4px; }
.cform__fine { font: 12px/1.4 var(--font-mono); letter-spacing: 0.02em; color: var(--color-fog-gray); }
/* Honeypot: off screen for people, still in the form for bots. */
.cform__trap { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.cform__err { flex-basis: 100%; font: 13px/1.4 var(--font-sans); color: var(--color-headline-black); border-left: 2px solid currentColor; padding-left: 10px; }
.cform__done { justify-items: start; align-content: center; min-height: 320px; }
.cform__done:focus { outline: none; }
.cform__done p { color: var(--text-muted); max-width: 420px; }
.cform__tick { width: 28px; height: 28px; border: 1px solid var(--color-ink-black); background: linear-gradient(45deg, transparent 46%, var(--color-signal-blue) 46% 54%, transparent 54%); }
@media (max-width: 1023px) { .contact__grid { grid-template-columns: 1fr; gap: 40px; } }
@media (max-width: 639px) { .cform__row { grid-template-columns: 1fr; } .cform .btn { width: 100%; } }

/* ---------- 3. Reframe: eight break points ---------- */
.reframe > .wrap { padding-bottom: var(--section-pad-y); }
.breaks {
  display: grid; grid-template-columns: repeat(4, 1fr);
  margin: clamp(48px, 6vw, 96px) calc(-1 * var(--content-inset)) 0;
  border-top: var(--border-grid);
}
.breaks__title { margin-top: clamp(48px, 6vw, 96px); font: var(--font-weight-medium) 12px/1.35 var(--font-mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-ink-black); }
.reframe .breaks { margin-top: 20px; }
.brk { display: grid; gap: 10px; align-content: start; min-height: 168px; padding: 16px 20px 24px; border-bottom: var(--border-section); }
.brk__label { margin-top: 16px; }
.brk__what { color: var(--text-muted); text-wrap: pretty; }
.brk__fix { margin-top: 6px; padding-top: 10px; border-top: var(--border-faq); color: var(--color-ink-black); text-wrap: pretty; }
.brk__fix b { display: block; margin-bottom: 4px; font: var(--font-weight-medium) 11px/1.4 var(--font-mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-signal-blue); }
.brk:not(:nth-child(4n)) { border-right: var(--border-section); }
.brk:nth-child(n+5) { border-bottom: 0; }
.brk__idx { font: 11px/1 var(--font-mono); letter-spacing: 0.06em; color: var(--color-fog-gray); }
.brk__label { font: var(--font-weight-regular) var(--text-heading-sm)/var(--leading-heading-sm) var(--font-display-free); letter-spacing: var(--tracking-heading-sm); color: var(--text-strong); }
@media (max-width: 1023px) {
  .breaks { grid-template-columns: repeat(2, 1fr); }
  .brk { min-height: 104px; padding: 14px 14px 18px; gap: 8px; }
  .brk:not(:nth-child(4n)) { border-right: 0; }
  .brk:nth-child(odd) { border-right: var(--border-section); }
  .brk:nth-child(n+5) { border-bottom: var(--border-section); }
  .brk:nth-child(n+7) { border-bottom: 0; }
  .brk__label { font-size: 20px; }
}
@media (max-width: 639px) {
  .breaks { grid-template-columns: 1fr; }
  .brk { grid-template-columns: 28px minmax(0, 1fr); column-gap: 8px; min-height: 0; padding: 16px var(--content-inset); border-right: 0 !important; border-bottom: var(--border-section) !important; }
  .brk:last-child { border-bottom: 0 !important; }
  .brk__idx { grid-row: 1 / 5; padding-top: 4px; }
  .brk__label { margin-top: 0; }
  .brk__what, .brk__fix { grid-column: 2; }
}

/* ---------- 3b. Components: eight part groups + the process shelf ---------- */
.components > .wrap { padding-block: var(--section-pad-y); }
.components__head { display: grid; gap: 24px; justify-items: start; }
.components__intro { max-width: 560px; text-wrap: pretty; }
.cgroups {
  display: grid; grid-template-columns: repeat(4, 1fr);
  margin: clamp(48px, 6vw, 96px) calc(-1 * var(--content-inset)) 0;
  border-top: var(--border-grid);
}
.cgroup { position: relative; display: grid; align-content: start; gap: 12px; padding: 40px 20px 28px; border-bottom: var(--border-section); }
.cgroup:not(:nth-child(4n)) { border-right: var(--border-section); }
.cgroup:nth-child(n+5) { border-bottom: 0; }
.cgroup__idx { position: absolute; top: 12px; left: 14px; font: 11px/1 var(--font-mono); letter-spacing: 0.06em; color: var(--color-fog-gray); }
.cgroup__name { font: var(--font-weight-medium) 12px/1.35 var(--font-mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-ink-black); }
.cgroup__items { color: var(--text-muted); text-wrap: pretty; }
.cgroup__items::first-letter { text-transform: uppercase; }
.cgroup__why { padding-top: 10px; border-top: var(--border-faq); color: var(--color-ink-black); text-wrap: pretty; }
.shelf__cap { margin: clamp(48px, 6vw, 80px) 0 0; font: var(--font-weight-medium) 12px/1.35 var(--font-mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-fog-gray); }
.components .shelf { margin-top: 20px; }
/* dotted flow 01 to 10: the active segment fills, then hands on to the next process */
.flow { display: grid; grid-template-columns: repeat(10, 1fr); margin-top: 20px; }
.flow__node { position: relative; display: grid; justify-items: center; gap: 8px; }
.flow__node::before { content: ""; position: absolute; top: 4px; left: 50%; width: 100%; border-top: 2px dotted var(--color-blueprint-gray); }
.flow__node:last-child::before { display: none; }
.flow__node i { position: relative; z-index: 1; width: 10px; height: 10px; border: 1px solid var(--color-ink-black); background: var(--bg-canvas); transition: background var(--duration-fast) var(--ease-out), transform var(--duration-fast) var(--ease-out); }
.flow__node span { font: 11px/1 var(--font-mono); letter-spacing: 0.06em; color: var(--color-fog-gray); transition: color var(--duration-fast) var(--ease-out); }
.flow__t { position: absolute; top: 4px; left: 50%; width: 100%; height: 2px; background: var(--color-signal-blue); transform: scaleX(0); transform-origin: left; }
.flow__node:last-child .flow__t { width: 0; }
.flow__node.is-done .flow__t { transform: scaleX(1); }
.flow__node.is-done i { background: var(--color-ink-black); }
.flow__node.is-on i { background: var(--color-signal-blue); border-color: var(--color-signal-blue); transform: scale(1.3); }
.flow__node.is-on span, .flow__node.is-done span { color: var(--color-ink-black); }
.flow.is-auto .flow__node.is-on .flow__t { animation: progress var(--flow-step, 1.6s) linear forwards; }
.flow.is-auto .flow__node:last-child.is-on .flow__t { --flow-step: 2.4s; }
.flow.is-paused .flow__t { animation-play-state: paused !important; }
.components .shelf .tile .illo { transition: transform 0.5s var(--ease-out); }
.components .shelf .tile.is-on { background: var(--texture-hatch), var(--bg-card-hatched); }
.components .shelf .tile.is-on .illo { transform: translateY(-6px); }
.components .shelf .tile.is-on .tile__idx { color: var(--color-signal-blue); }
@media (prefers-reduced-motion: reduce) { .flow__t, .flow__node i, .components .shelf .tile .illo { transition: none; animation: none !important; } }
@media (max-width: 1023px) {
  .cgroups { grid-template-columns: repeat(2, 1fr); }
  .cgroup { padding: 36px 14px 20px; }
  .cgroup:not(:nth-child(4n)) { border-right: 0; }
  .cgroup:nth-child(odd) { border-right: var(--border-section); }
  .cgroup:nth-child(n+5) { border-bottom: var(--border-section); }
  .cgroup:nth-child(n+7) { border-bottom: 0; }
}
@media (max-width: 639px) {
  .cgroups { grid-template-columns: 1fr; }
  .cgroup { grid-template-columns: 28px minmax(0, 1fr); column-gap: 8px; padding: 16px var(--content-inset); border-right: 0 !important; border-bottom: var(--border-section) !important; }
  .cgroup:last-child { border-bottom: 0 !important; }
  .cgroup__idx { position: static; grid-row: 1 / 3; padding-top: 2px; }
  .components .shelf .tile { min-height: 150px; }
  .components .shelf .tile .illo { max-width: 112px; }
  .flow__node span { font-size: 9px; letter-spacing: 0; }
}

.chain.chain--flow li::after { content: none; }
.stats__src { margin-top: 20px; font: 12px/1.5 var(--font-mono); letter-spacing: 0.04em; color: var(--color-fog-gray); }

/* ---------- 3. Reframe + shelf ---------- */
.reframe > .wrap { padding-top: var(--section-pad-y); }
.split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--grid-gap); }
.split .h2 { max-width: 520px; }
.split__body { display: grid; gap: 20px; max-width: 520px; }
@media (max-width: 1023px) { .split { grid-template-columns: 1fr; gap: 32px; } }

.shelf {
  display: grid; grid-template-columns: repeat(5, 1fr);
  margin: clamp(56px, 7vw, 112px) calc(-1 * var(--content-inset)) 0;
  border-top: var(--border-grid);
}
.tile {
  position: relative; display: grid; grid-template-rows: 1fr auto; gap: 16px;
  padding: 40px 20px 24px; min-height: 230px;
  border-bottom: var(--border-section);
}
.tile:not(:nth-child(5n)) { border-right: var(--border-section); }
.tile:nth-child(n+6) { border-bottom: 0; }
.tile .illo { width: 100%; max-width: 150px; height: auto; margin: auto; }
.tile__idx { position: absolute; top: 12px; left: 14px; font: 11px/1 var(--font-mono); letter-spacing: 0.06em; color: var(--color-fog-gray); }
.tile__label {
  font: var(--font-weight-medium) 12px/1.35 var(--font-mono); letter-spacing: 0.05em; text-transform: uppercase;
  color: var(--color-ink-black); text-align: center;
}
@media (max-width: 1023px) {
  .shelf { grid-template-columns: repeat(2, 1fr); }
  .tile { min-height: 190px; padding: 32px 12px 20px; }
  .tile:not(:nth-child(5n)) { border-right: 0; }
  .tile:nth-child(odd) { border-right: var(--border-section); }
  .tile:nth-child(n+6) { border-bottom: var(--border-section); }
  .tile:nth-child(n+9) { border-bottom: 0; }
  .tile__label { font-size: 11px; }
}

/* ---------- 4. Run sizes (navy) ---------- */
.runs > .wrap { padding-block: var(--section-pad-y); }
.runs__grid { display: grid; grid-template-columns: 5fr 7fr; gap: 48px var(--grid-gap); align-items: end; }
.runs__head { display: grid; gap: 24px; align-content: start; justify-items: start; align-self: stretch; }
.guilloche {
  position: relative; width: 100%; min-height: 200px; margin-top: auto;
  background: var(--texture-guilloche), rgba(255, 255, 255, 0.03);
  background-size: 240px 120px, auto;
  border: 1px dashed rgba(255, 255, 255, 0.22);
  display: flex; align-items: flex-end; justify-content: space-between; padding: 10px 12px;
  font: var(--text-micro)/1.5 var(--font-mono); letter-spacing: 0.08em; color: rgba(255, 255, 255, 0.55);
}
.tiers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; align-items: end; }
.tier { display: grid; gap: 14px; }
.tier__size { font-size: var(--text-tier); line-height: var(--leading-tier); letter-spacing: var(--tracking-tier); text-transform: uppercase; color: var(--text-on-dark); }
.tier__col {
  display: flex; flex-direction: column-reverse; gap: 6px;
  padding: 12px; border: 1px dashed rgba(255, 255, 255, 0.35);
}
.tier__col i { display: block; height: 14px; background: rgba(255, 255, 255, 0.16); }
.tier__col i:nth-child(n+3) { background: rgba(78, 211, 207, 0.55); }
.tier__col i:nth-child(n+6) { background: var(--data-teal); }
.tier__col i:nth-child(n+8) { background: var(--data-sky); }
.tier__col i:nth-child(n+10) { background: var(--data-azure); }
.tier__cap { font: var(--text-caption)/1.5 var(--font-mono); letter-spacing: var(--tracking-caption); text-transform: uppercase; color: var(--text-on-dark-muted); }
@media (max-width: 1023px) {
  .runs__grid { grid-template-columns: 1fr; }
  .guilloche { min-height: 120px; }
}
@media (max-width: 639px) {
  .tiers { gap: 8px; }
  .tier__size { font-size: 19px; }
  .tier__col { padding: 8px; gap: 5px; }
  .tier__col i { height: 11px; }
  .tier__cap { font-size: 11px; letter-spacing: 0.02em; }
}

.pair { display: grid; grid-template-columns: 1fr 1fr; gap: 40px var(--grid-gap); margin-top: clamp(56px, 6vw, 88px); padding-top: 40px; border-top: 1px dashed rgba(255, 255, 255, 0.22); }
.pair__item { display: grid; gap: 16px; max-width: 520px; }
.pair__title { display: flex; align-items: center; gap: 12px; font: var(--font-weight-regular) var(--text-heading-sm)/var(--leading-heading-sm) var(--font-display-free); letter-spacing: var(--tracking-heading-sm); color: var(--text-on-dark); }
.icon { width: 16px; height: 16px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.2; stroke-linecap: square; }
@media (max-width: 767px) { .pair { grid-template-columns: 1fr; } }

/* ---------- 5. How it works (near-black) ---------- */
.how > .wrap { padding-block: var(--section-pad-y); }
.steps {
  display: grid; grid-template-columns: 1fr 1fr; grid-template-areas: "head art" "list art";
  grid-template-rows: auto 1fr;
  border: var(--border-panel-dark);
}
.steps__head { grid-area: head; display: grid; gap: 24px; justify-items: start; padding: clamp(32px, 4vw, 56px) clamp(20px, 3.5vw, 48px) 40px; }
.steps__list { grid-area: list; padding: 0 clamp(20px, 3.5vw, 48px) clamp(24px, 3.5vw, 48px); align-self: end; }
.steps__art { grid-area: art; border-left: var(--border-panel-dark); }
.step { border-top: 1px solid var(--color-panel-line-dark); }
.step__head { font: inherit; }
.step__btn {
  width: 100%; display: flex; align-items: center; gap: 14px; padding: 20px 0;
  background: none; border: 0; cursor: pointer; text-align: left;
  font: var(--font-weight-medium) var(--text-label)/var(--leading-label) var(--font-sans); letter-spacing: var(--tracking-label); text-transform: uppercase;
  color: rgba(255, 255, 255, 0.6); transition: color var(--duration-instant) var(--ease-standard);
}
.step__btn:hover, .step.is-active .step__btn { color: var(--text-on-dark); }
.step__dot { width: 6px; height: 6px; border-radius: var(--radius-full); background: rgba(255, 255, 255, 0.3); transition: background-color var(--duration-fast) var(--ease-out); }
.step.is-active .step__dot { background: var(--color-scanner-cyan); }
.step__panel {
  display: grid; grid-template-rows: 0fr; visibility: hidden;
  transition: grid-template-rows var(--duration-slow) var(--ease-out), visibility 0s linear var(--duration-slow);
}
.step.is-active .step__panel { grid-template-rows: 1fr; visibility: visible; transition-delay: 0s; }
.step__inner { overflow: hidden; min-height: 0; }
.step__title { font-size: var(--text-heading); line-height: var(--leading-heading); letter-spacing: var(--tracking-heading); color: var(--text-on-dark); }
.step__body { margin-top: 16px; max-width: 480px; line-height: var(--leading-body-relaxed); color: var(--text-on-dark-muted); }
.track { display: block; height: 1px; margin: 24px 0 28px; background: rgba(255, 255, 255, 0.14); overflow: hidden; }
.track__fill { display: block; height: 100%; background: var(--color-sky-signal); transform: scaleX(0); transform-origin: left; }
.steps.is-auto .step.is-active .track__fill { animation: progress var(--advance, 7s) linear forwards; }
.steps.is-paused .track__fill, .tabs.is-paused .tab__bar { animation-play-state: paused !important; }
.step__checks { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 18px; }
.step__checks li { font: var(--font-weight-medium) 11px/1.4 var(--font-mono); letter-spacing: 0.04em; text-transform: uppercase; color: rgba(255, 255, 255, 0.82); border: 1px dashed rgba(255, 255, 255, 0.3); padding: 3px 7px; }
.step__gets { margin-top: 16px; color: rgba(255, 255, 255, 0.82); }
.step__gets b { display: block; margin-bottom: 4px; font: var(--font-weight-medium) 11px/1.4 var(--font-mono); letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-sky-signal); }
@keyframes progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }

.steps__frame { position: relative; height: 100%; min-height: 520px; }
.step-art {
  position: absolute; inset: 0; display: grid; place-items: center; padding: 48px;
  opacity: 0; clip-path: inset(0 0 0 100%);
  transition: opacity var(--duration-wipe) var(--ease-drawer), clip-path var(--duration-wipe) var(--ease-drawer);
}
.step-art.is-active { opacity: 1; clip-path: inset(0); }
.step-art .illo { width: 100%; max-width: 480px; max-height: 100%; height: auto; }
.steps__hud { position: absolute; right: 16px; bottom: 14px; font: var(--text-micro)/1.5 var(--font-mono); letter-spacing: 0.08em; color: rgba(255, 255, 255, 0.45); }
@media (max-width: 1023px) {
  .steps { grid-template-columns: 1fr; grid-template-areas: "head" "art" "list"; grid-template-rows: auto; }
  .steps__art { border-left: 0; border-block: var(--border-panel-dark); }
  .steps__frame { min-height: 0; aspect-ratio: 4 / 3; }
  .step-art { padding: 24px; }
  .steps__list { padding-top: 8px; }
  .step:first-child { border-top: 0; }
}

/* ---------- 6. Proof tabs ---------- */
.proof > .wrap { padding-block: var(--section-pad-y); }
.proof__head { display: grid; gap: 24px; justify-items: start; margin-bottom: 48px; }
.tabs__panels { border: var(--border-tab); border-bottom: 0; }
.panel { display: grid; grid-template-columns: 1fr 1fr; min-height: 513px; }
.panel:focus-visible { outline-offset: -2px; }
.panel__text {
  display: grid; align-content: center; gap: 0;
  padding: 56px 48px 56px clamp(24px, 5.5vw, 80px);
  background: var(--texture-hatch), var(--bg-card-hatched);
}
.panel__text .h3 { margin: 16px 0 20px; max-width: 520px; }
.panel__text p { max-width: 520px; color: #5f6066; }
.panel__demo { position: relative; display: grid; place-items: center; padding: 48px; background: var(--texture-guilloche), var(--bg-band-brand); background-size: 240px 120px, auto; overflow: hidden; }
.panel:not([hidden]) .doc { animation: wipe-in var(--duration-wipe) var(--ease-drawer) both; }
.panel:not([hidden]) .panel__text > * { animation: reveal-fade var(--duration-fast) var(--ease-out) both; }

.doc {
  position: relative; width: min(420px, 100%); padding: 18px;
  background: var(--texture-grain), var(--color-paper-white); color: var(--color-ink-black);
  font: 11px/1.4 var(--font-mono); letter-spacing: 0.04em; text-transform: uppercase;
  overflow: hidden;
}
.doc__bar { display: flex; justify-content: space-between; gap: 12px; padding-bottom: 12px; margin-bottom: 14px; border-bottom: 1px dashed var(--color-rule-gray); font-size: 11px; color: var(--color-fog-gray); }
.doc__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.doc__grid li { display: grid; gap: 18px; padding: 12px; border: 1px dashed var(--color-blueprint-gray); }
.doc__grid b { align-self: end; }
.doc__grid b, .chain li::after { justify-self: start; font-weight: 500; font-size: 11px; color: var(--color-signal-blue); border: 1px solid var(--color-sky-signal); padding: 2px 5px; background: rgba(73, 157, 248, 0.08); }
.doc__foot { display: flex; align-items: center; gap: 6px; margin-top: 14px; font-size: 11px; color: var(--color-fog-gray); }
.doc__foot i { flex: 1; height: 6px; background: var(--data-ice); }
.doc__foot i:nth-child(3) { background: var(--data-sky); opacity: 0.5; }
.chain { display: grid; counter-reset: c; }
.chain li { counter-increment: c; display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px dashed var(--color-rule-gray); }
.chain li::before { content: counter(c, decimal-leading-zero); color: var(--color-fog-gray); font-size: 11px; }
.chain li::after { content: "Grade A"; margin-left: auto; }
.cost { display: grid; gap: 18px; padding: 8px 0 4px; }
.cost__row { display: grid; gap: 8px; }
.cost__bar { display: block; height: 22px; width: var(--w); background: var(--texture-hatch), #d9dade; }
.cost__bar--ours { background: var(--data-sky); }
.scanline {
  position: absolute; left: 0; right: 0; top: 0; height: 2px; background: var(--color-sky-signal); opacity: 0.55;
  animation: scan 3.6s var(--ease-in-out-sine) infinite alternate;
}
@keyframes scan { from { transform: translateY(0); } to { transform: translateY(var(--scan-h, 220px)); } }

.tabs__list { display: grid; grid-template-columns: repeat(3, 1fr); }
.tab {
  position: relative; height: 72px; padding: 0 16px; margin-left: -1px;
  background: transparent; border: var(--border-tab); border-radius: 0; cursor: pointer;
  font-size: var(--text-tab); line-height: 1.2; color: var(--text-strong);
  transition: background-color var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out), transform var(--duration-instant) var(--ease-snap);
}
.tab:first-child { margin-left: 0; }
.tab:hover { background: rgba(0, 0, 0, 0.03); }
.tab:active { transform: scale(var(--press-scale)); }
.tab[aria-selected="true"] { background: var(--color-headline-black); color: #f2f2f2; border-color: var(--color-headline-black); }
.tab__bar { position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--color-sky-signal); transform: scaleX(0); transform-origin: left; }
.tabs.is-auto .tab[aria-selected="true"] .tab__bar { animation: progress var(--advance, 7s) linear forwards; }
@media (max-width: 1023px) {
  .panel { grid-template-columns: 1fr; min-height: 0; }
  .panel__text { padding: 40px 24px; }
  .panel__demo { padding: 32px 20px; min-height: 300px; }
}
@media (max-width: 639px) {
  .panel__text { padding: 32px 16px; }
  .tab { height: 56px; padding: 0 8px; font-size: 15px; }
  .doc__grid li { gap: 12px; padding: 10px; }
}

/* ---------- 7. Assurances ---------- */
.assure > .wrap { padding-block: var(--section-pad-y); }
.assure__head { display: grid; gap: 24px; justify-items: start; margin-bottom: 48px; }
.cards { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.card {
  position: relative; min-height: 300px; padding: 32px 48px 80px 32px;
  background: var(--texture-hatch), var(--bg-card-hatched);
  font-size: var(--text-heading); line-height: 1.12; letter-spacing: -0.01em; color: var(--text-strong); text-wrap: pretty;
}
.card::before { content: ""; position: absolute; top: 0; right: 0; border-top: 16px solid var(--color-headline-black); border-left: 16px solid transparent; }
.card::after { /* a ream of paper along the bottom edge */
  content: ""; position: absolute; left: 32px; right: 32px; bottom: 24px; height: 21px;
  background: repeating-linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0 1px, transparent 1px 5px);
}
@media (max-width: 767px) { .cards { grid-template-columns: 1fr; } .card { min-height: 220px; padding: 24px 40px 72px 20px; } .card::after { left: 20px; right: 20px; } }

/* ---------- 7b. Team ---------- */
.team > .wrap { padding-block: var(--section-pad-y); }
.team__head { display: grid; gap: 24px; justify-items: start; margin-bottom: 48px; }
.team__intro { max-width: 520px; text-wrap: pretty; }
.members { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 48px 20px; }
.member { display: grid; align-content: start; }
.member__tile { /* photo placeholder: an isometric monogram block on a hatched plate */
  position: relative; aspect-ratio: 1; display: grid; place-items: center;
  border: 1px dashed rgba(0, 0, 0, 0.25); background: var(--texture-hatch), var(--bg-card-hatched);
}
.member__tile::before { content: ""; position: absolute; top: 10px; left: 10px; width: 6px; height: 6px; border: 1px solid var(--color-ink-black); }
.member__tile .illo { width: 58%; height: auto; margin-top: -6%; }
.member__tile .tag { position: absolute; left: 12px; bottom: 12px; }
.member__code { position: absolute; right: 12px; bottom: 14px; font: var(--text-micro)/1.5 var(--font-mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-fog-gray); }
.illo .glyph { fill: var(--ln); stroke: none; font-family: var(--font-display-free); font-size: 74px; letter-spacing: -0.02em; }
.member__name {
  margin-top: 24px; font: var(--font-weight-regular) var(--text-heading-sm)/var(--leading-heading-sm) var(--font-display-free);
  letter-spacing: var(--tracking-heading-sm); color: var(--text-strong);
}
.member__role {
  margin-top: 10px; font: var(--font-weight-medium) 12px/1.35 var(--font-mono);
  letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-ink-black);
}
.member__focus { margin-top: 12px; padding-top: 12px; border-top: var(--border-faq); max-width: 320px; text-wrap: pretty; }
/* two named profiles with real photos (site v0.7) */
.members--duo { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px 40px; }
.member--photo { grid-template-columns: 200px minmax(0, 1fr); grid-template-rows: auto auto 1fr; column-gap: 28px; }
.member--photo .member__tile { grid-row: 1 / 4; align-self: start; }
.member--photo .member__name { margin-top: 0; }
.member--photo .member__focus { max-width: 440px; }
.member__tile--photo { aspect-ratio: 560 / 644; overflow: hidden; border: 1px solid var(--color-ink-black); background: var(--bg-card-hatched); }
.member__tile--photo::before { display: none; }
.member__tile--photo img { display: block; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.04); }
@media (max-width: 1023px) { .members { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 1023px) { .members--duo { grid-template-columns: 1fr; } }
@media (max-width: 639px) {
  .members { grid-template-columns: 1fr; gap: 0; border-top: var(--border-faq); }
  .member { grid-template-columns: 112px minmax(0, 1fr); grid-template-rows: auto auto 1fr; column-gap: 16px; padding: 20px 0; border-bottom: var(--border-faq); }
  .member__tile { grid-row: 1 / 4; align-self: start; }
  .member__tile .illo { width: 70%; margin-top: -10%; }
  .member__tile .tag { left: 6px; bottom: 6px; font-size: 9px; padding: 1px 4px; }
  .member__tile::before { top: 6px; left: 6px; }
  .member__code { display: none; }
  .member__name { margin-top: 0; }
  .member__role { margin-top: 6px; font-size: 11px; }
  .member__focus { margin-top: 8px; padding-top: 0; border-top: 0; }
}

/* ---------- 8. Who it's for (lavender) ---------- */
.fit > .wrap { padding-block: var(--section-pad-y); }
.fit__grid { display: grid; grid-template-columns: 5fr 7fr; gap: 48px var(--grid-gap); align-items: center; }
.fit__copy { display: grid; gap: 24px; justify-items: start; max-width: 460px; }
.ring { display: grid; grid-template-columns: repeat(3, minmax(0, 150px)); gap: 12px; justify-content: center; }
.dev {
  position: relative; aspect-ratio: 1; display: grid; grid-template-rows: 1fr auto; padding: 12px;
  border: 1px dashed rgba(0, 0, 0, 0.25); background: rgba(252, 252, 252, 0.55);
}
.dev::before { content: ""; position: absolute; top: 10px; left: 10px; width: 6px; height: 6px; border: 1px solid var(--color-ink-black); }
.dev .illo { width: 78%; height: auto; margin: auto; }
.dev span { font-size: 13px; line-height: 1.3; color: var(--text-strong); }
.ring__core {
  aspect-ratio: 1; display: grid; align-content: space-between; padding: 14px;
  background: var(--texture-guilloche), var(--bg-band-brand); background-size: 240px 120px, auto; color: var(--text-on-dark);
}
.ring__mark { font-size: 22px; letter-spacing: -0.03em; line-height: 1; }
.ring__meta { font: var(--text-micro)/1.6 var(--font-mono); letter-spacing: 0.08em; text-transform: uppercase; color: rgba(255, 255, 255, 0.7); }
@media (max-width: 1023px) { .fit__grid { grid-template-columns: 1fr; } .ring { justify-content: start; } }
@media (max-width: 639px) {
  .ring { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .dev { padding: 8px; }
  .dev span { font-size: 12px; }
  .ring__mark { font-size: 17px; }
  .ring__core { padding: 10px; }
}

/* ---------- 9. Final CTA ---------- */
.cta { position: relative; overflow: hidden; background: var(--bg-footer); padding-block: clamp(96px, 11vw, 168px); --frame-line: rgba(255, 255, 255, 0.12); }
.collage { position: absolute; inset: 0; pointer-events: none; }
.scrap { position: absolute; display: block; }
.scrap--1, .scrap--2, .scrap--3, .scrap--4 {
  background: repeating-linear-gradient(to bottom, transparent 0 11px, rgba(0, 0, 0, 0.09) 11px 12px), var(--texture-grain), #efeee9;
}
.scrap--1 { width: 34%; height: 58%; left: -6%; top: 6%; transform: rotate(-7deg); clip-path: polygon(0 3%, 96% 0, 100% 88%, 93% 92%, 97% 100%, 4% 97%); }
.scrap--2 { width: 26%; height: 46%; right: -4%; top: -6%; transform: rotate(8deg); clip-path: polygon(3% 0, 100% 4%, 98% 100%, 0 95%, 5% 60%); }
.scrap--3 { width: 22%; height: 30%; left: 12%; bottom: -8%; transform: rotate(5deg); background: var(--texture-hatch), #dfe1e8; clip-path: polygon(0 0, 100% 6%, 96% 100%, 3% 94%); }
.scrap--4 { width: 30%; height: 38%; right: 6%; bottom: -10%; transform: rotate(-4deg); clip-path: polygon(2% 4%, 100% 0, 97% 96%, 0 100%); }
.scrap--blue { width: 24%; height: 50%; right: 18%; top: 22%; transform: rotate(3deg); background: var(--texture-guilloche), var(--bg-band-brand); background-size: 240px 120px, auto; }
.chipstrip { position: absolute; height: 14px; width: 220px; background: repeating-linear-gradient(90deg, var(--data-sky) 0 2px, transparent 2px 5px, var(--data-olive) 5px 7px, transparent 7px 9px, var(--data-highlighter) 9px 10px, transparent 10px 13px); }
.chipstrip--1 { left: 8%; top: 12%; transform: rotate(-7deg); }
.chipstrip--2 { right: 10%; bottom: 18%; transform: rotate(4deg); }
.cta__card {
  position: relative; z-index: 1; max-width: 860px; min-height: 380px; margin-inline: auto;
  display: grid; justify-items: center; align-content: center; text-align: center;
  padding: 72px 40px 24px; background: var(--texture-grain), var(--color-paper-white);
}
.cta__card::before { content: ""; position: absolute; inset: 12px; border: 1px dashed var(--color-blueprint-gray); pointer-events: none; }
.cta__h2 { font-size: var(--text-cta); line-height: var(--leading-cta); letter-spacing: var(--tracking-cta); color: var(--text-strong); text-wrap: balance; }
.cta__card .btn { margin-top: 48px; }
.hud--card { width: 100%; margin-top: 64px; padding: 0; font-size: 7px; }
@media (max-width: 639px) {
  .cta__card { padding: 56px 24px 24px; min-height: 0; }
  .cta__card .btn { width: 100%; }
  .scrap--blue { width: 50%; right: -10%; }
  .scrap--1 { width: 70%; } .scrap--2 { width: 60%; }
  .hud--card { justify-content: center; }
}

/* ---------- 10. Footer ---------- */
.footer > .wrap { padding-top: 54px; }
.footer { background: var(--bg-footer); color: rgba(255, 255, 255, 0.6); --frame-line: rgba(255, 255, 255, 0.12); overflow: hidden; }
.footer__cols { display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px var(--grid-gap); }
.fcol__title { display: flex; gap: 8px; padding-bottom: 14px; margin-bottom: 18px; border-bottom: 1px dashed rgba(255, 255, 255, 0.3); font-size: var(--text-tab); line-height: var(--leading-tab); color: var(--text-on-dark); }
.fcol__title span:first-child { color: rgba(255, 255, 255, 0.5); }
.fcol ul { display: grid; gap: 10px; }
.fcol a { font: var(--text-mono-link)/var(--leading-mono-link) var(--font-mono); letter-spacing: var(--tracking-mono-link); text-transform: uppercase; text-decoration: none; transition: color var(--duration-instant) var(--ease-standard); }
.fcol a:hover { color: var(--text-on-dark); }
.fcol .tag { vertical-align: 0; }
.footer__watermark {
  margin-top: clamp(64px, 8vw, 120px);
  font-size: clamp(72px, 18.5vw, 300px); line-height: 0.8; letter-spacing: -0.05em; text-align: center; white-space: nowrap;
  color: rgba(255, 255, 255, 0.06);
  user-select: none;
}
.footer__legal { padding: 28px 0 40px; font: var(--text-caption)/1.6 var(--font-mono); letter-spacing: 0.06em; text-transform: uppercase; }
@media (max-width: 767px) { .footer__cols { grid-template-columns: 1fr 1fr; } .fcol a { font-size: 12px; } }

/* ---------- Illustrations ---------- */
.illo { overflow: visible;
  --ln: #2a2b2f; --f-t: #fcfcfc; --f-l: #eeeeef; --f-r: #dcdde0; --f-in: #e6e7ea;
  --f-pcb: #e3edf3; --f-chip: #3a3b40; --dk: #3a3b40; --acc: var(--color-sky-signal); --soft: rgba(73, 157, 248, 0.16); --dash: var(--color-blueprint-gray);
}
.band--dark .illo { --ln: rgba(255, 255, 255, 0.62); --f-t: #1c1c1b; --f-l: #141413; --f-r: #0f0f0e; --f-in: #090909; --f-pcb: #10243d; --f-chip: #2e2e2e; --dk: #3a3a3a; --soft: rgba(73, 157, 248, 0.22); --dash: rgba(255, 255, 255, 0.28); }
.illo * { vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.illo polygon, .illo path:not(.leader):not(.acc-ln):not(.dash), .illo ellipse, .illo circle, .illo rect { stroke: var(--ln); stroke-width: 1; }
.illo .f-t { fill: var(--f-t); } .illo .f-l { fill: var(--f-l); } .illo .f-r { fill: var(--f-r); } .illo .f-in { fill: var(--f-in); }
.illo .f-pcb { fill: var(--f-pcb); } .illo .f-chip { fill: var(--f-chip); } .illo .f-acc { fill: var(--acc); }
.illo .dk { fill: var(--dk); stroke: none; }
.illo .acc { fill: var(--acc); stroke: none; }
.illo .soft { fill: var(--soft); stroke: none; }
.illo .dot { fill: var(--ln); stroke: none; }
.illo .ln { fill: none; stroke: var(--ln); stroke-width: 1; }
.illo .ln.faint { opacity: 0.35; }
.illo .acc-ln { fill: none; stroke: var(--acc); stroke-width: 1.25; }
.illo .acc-ln.thick { stroke-width: 2; }
.illo .dash { fill: none; stroke: var(--dash); stroke-width: 1; stroke-dasharray: 3 4; }
.illo .leader { fill: none; stroke: var(--color-ink-black); stroke-width: 1; }
.illo .tick { stroke: var(--color-ink-black); stroke-width: 1; }
.illo .anchor { fill: var(--color-ink-black); stroke: none; }

/* ---------- Reveal on scroll (only when JS runs) ---------- */
.js [data-reveal="fade"] { opacity: 0; transform: translateY(var(--reveal-shift)); transition: opacity var(--duration-reveal) var(--ease-snap), transform var(--duration-reveal) var(--ease-snap); transition-delay: calc(var(--d, 0) * 90ms); }
.js [data-reveal="blur"] { opacity: 0; filter: blur(var(--reveal-blur)); transition: opacity var(--duration-slow) var(--ease-snap), filter var(--duration-slow) var(--ease-snap); }
.js [data-reveal="wipe"] { clip-path: inset(0 100% 0 0); transition: clip-path var(--duration-wipe) var(--ease-drawer); transition-delay: calc(var(--d, 0) * 60ms); }
.js [data-reveal="stagger"] > * { opacity: 0; transform: translateY(12px); transition: opacity var(--duration-wipe) var(--ease-drawer), transform var(--duration-wipe) var(--ease-drawer); transition-delay: calc(var(--i, 0) * 50ms); }
.js [data-reveal].is-in, .js [data-reveal="stagger"].is-in > * { opacity: 1; transform: none; filter: none; clip-path: inset(0); }
.js [data-reveal="parts"] .part { opacity: 0; transform: translateY(-28px); transition: opacity var(--duration-wipe) var(--ease-drawer), transform var(--duration-slow) var(--ease-drawer); }
.js [data-reveal="parts"] .layer { transition-delay: calc((5 - var(--i)) * 80ms); }
.js [data-reveal="parts"] .guide { transform: none; transition-delay: 420ms; }
.js [data-reveal="parts"] .leader { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 550ms var(--ease-drawer); transition-delay: calc(560ms + var(--i) * 60ms); }
.js [data-reveal="parts"] .leader-g circle, .js [data-reveal="parts"] .tick, .js [data-reveal="parts"] .callout { opacity: 0; transition: opacity var(--duration-fast) var(--ease-out); transition-delay: calc(760ms + var(--i) * 60ms); }
.js [data-reveal="parts"].is-in .part, .js [data-reveal="parts"].is-in .leader-g circle, .js [data-reveal="parts"].is-in .tick, .js [data-reveal="parts"].is-in .callout { opacity: 1; }
.js [data-reveal="parts"].is-in .part { transform: none; }
.js [data-reveal="parts"].is-in .leader { stroke-dashoffset: 0; }
.leader-g { --i: 0; }

@media (prefers-reduced-motion: reduce) {
  .js [data-reveal], .js [data-reveal] *, .step-art, .panel .doc, .panel__text > * {
    opacity: 1; transform: none !important; filter: none !important; clip-path: none !important;
    transition: none !important; animation: none !important;
  }
  .js [data-reveal="parts"] .leader { stroke-dashoffset: 0; }
  .step-art:not(.is-active) { opacity: 0; }
  .scanline, .track, .tab__bar { display: none; }
  .step__panel { transition: none; }
  .btn::before { display: none; }
}

/* ---------- Dev aid: ?slots=1 outlines every copy slot ---------- */
.show-slots [data-slot] { outline: 1px dashed rgba(73, 157, 248, 0.8); outline-offset: 2px; }
.show-slots [data-slot]:hover::after {
  content: attr(data-slot); position: absolute; z-index: 90; margin: 4px 0 0 4px; padding: 2px 6px;
  background: var(--color-ink-black); color: #fff; font: 11px/1.4 var(--font-mono); letter-spacing: 0; text-transform: none;
}
/* ---------- Review aid: content variant picker (?v=a|b|c) ---------- */
.vpick {
  position: fixed; right: 12px; bottom: 12px; z-index: 60;
  display: flex; align-items: stretch;
  background: var(--texture-grain), var(--color-paper-white); border: 1px solid var(--color-tab-gray);
  font: var(--font-weight-medium) 11px/1 var(--font-mono); letter-spacing: 0.06em; text-transform: uppercase;
}
.vpick__label { display: flex; align-items: center; padding: 0 10px; color: var(--color-fog-gray); }
.vpick__btn {
  min-height: 32px; padding: 0 12px; margin: -1px -1px -1px 0;
  background: transparent; border: var(--border-tab); border-radius: 0; cursor: pointer;
  font: inherit; letter-spacing: inherit; text-transform: inherit; color: var(--color-ink-black); white-space: nowrap;
  transition: background-color var(--duration-fast) var(--ease-out), color var(--duration-fast) var(--ease-out), transform var(--duration-instant) var(--ease-snap);
}
.vpick__btn:hover { background: rgba(0, 0, 0, 0.04); }
.vpick__btn:active { transform: scale(0.98); }
.vpick__btn[aria-pressed="true"] { background: var(--color-ink-black); border-color: var(--color-ink-black); color: #f2f2f2; }
.vpick__btn:focus-visible { outline-offset: -4px; outline-color: var(--color-sky-signal); position: relative; z-index: 1; }
@media (max-width: 639px) {
  .vpick__name { display: none; }
  .vpick__btn { min-width: 36px; padding: 0 10px; }
}
@media print { .vpick, .slots-toggle { display: none !important; } }

.slots-toggle { position: fixed; left: 12px; bottom: 12px; z-index: 60; padding: 6px 10px; border: 1px dashed var(--color-sky-signal); background: var(--color-paper-white); font: 11px/1 var(--font-mono); text-transform: uppercase; letter-spacing: 0.06em; cursor: pointer; }