/* ============ FONTS ============ */
@font-face {
  font-family: "JetBrains Mono";
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url("/assets/fonts/jetbrains-mono-latin-400-500.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Newsreader";
  font-style: normal;
  font-weight: 300 400;
  font-display: swap;
  src: url("/assets/fonts/newsreader-latin-300-400.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Newsreader";
  font-style: italic;
  font-weight: 300 400;
  font-display: swap;
  src: url("/assets/fonts/newsreader-latin-italic-300-400.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ============ TOKENS ============ */
:root {
  --cream:      #F4EFE6;
  --cream-soft: #ECE5D7;
  --ink:        #1A1916;
  --ink-quiet:  #6B6862;
  --hairline:   rgba(26, 25, 22, 0.16);
  /* Generated from assets/wordmark-mask.svg by scripts/build_media.py. */
  --wordmark-mask: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMDMgODIiPjxwYXRoIGQ9Ik0yNDIuNjQzIDcyLjg0NTNDMjQyLjc5MSA3MS44ODA1IDI0My4wNDMgNzAuNjkwOSAyNDMuMzk5IDY5LjI3NjhDMjQzLjc1MiA2Ny44MzA0IDI0NC4xIDY2LjQ4MjYgMjQ0LjQ0MyA2NS4yMzM0QzI0NC44MTggNjMuOTgwNCAyNDUuMzIgNjIuNDE4NCAyNDUuOTQ5IDYwLjU0NzRDMjQ2LjU3NSA1OC42NDQyIDI0Ny4wNTggNTcuMTk4NyAyNDcuMzk5IDU2LjIxMTFDMjQ3Ljc0IDU1LjIyMzUgMjQ4LjI0MiA1My43OTIzIDI0OC45MDMgNTEuOTE3NUMyNDkuNTY0IDUwLjA0MjcgMjQ5Ljk0MiA0OC45NTI3IDI1MC4wMzcgNDguNjQ3NUMyNTAuNjc0IDQ2Ljg0MDkgMjUxLjcyOCA0NC40MTM1IDI1My4xOTkgNDEuMzY1M0MyNTQuNzAyIDM4LjMxMzMgMjU1LjkxNSAzNS40NDIzIDI1Ni44NCAzMi43NTI0QzI1Ny43OTQgMzAuMDI2NSAyNTguMzQ3IDI3LjIzMzMgMjU4LjUgMjQuMzcyOEMyNTguODIgMTguNDg2OSAyNTkuNzE1IDE0LjAxOTkgMjYxLjE4NiAxMC45NzE3QzI2Mi42ODkgNy45MTk2NiAyNjQuOTUyIDYuNjA3NzQgMjY3Ljk3NiA3LjAzNTkyQzI2OS45MzQgNy4yOTU0NyAyNzEuNjggNy45NzIwNyAyNzMuMjE0IDkuMDY1NzFDMjc0Ljc3NiAxMC4xMjMzIDI3Ni4xMzIgMTEuNTE1NSAyNzcuMjgzIDEzLjI0MjRDMjc4LjQ2MiAxNC45MzMxIDI3OS40OTYgMTYuNjQxIDI4MC4zODUgMTguMzY1OUMyODEuMzA3IDIwLjA4NyAyODIuMzU3IDIyLjA3MDcgMjgzLjUzNiAyNC4zMTY5QzI4NC43MTYgMjYuNTYzMSAyODUuODMzIDI4LjQyNDUgMjg2Ljg4OSAyOS45MDExQzI4Ny44MjkgMzEuMjI3OSAyODguOTg0IDMzLjU0MjQgMjkwLjM1MyAzNi44NDQ0QzI5MS43MTggNDAuMTE0MiAyOTIuNjMxIDQyLjE3OTQgMjkzLjA5MiA0My4wMzk5QzI5My43MjMgNDQuMjM5OCAyOTQuOTM1IDQ3LjE4NDUgMjk2LjcyOSA1MS44NzQxQzI5OC41NTUgNTYuNTU5OSAyOTkuODU3IDU5LjU3NTcgMzAwLjYzNiA2MC45MjE1QzMwMS42MTggNjIuNjAyOCAzMDEuOTc5IDYzLjk5NzkgMzAxLjcxNyA2NS4xMDY5QzMwMS40OTIgNjYuMjQ0MyAzMDAuODA0IDY3LjA2MDQgMjk5LjY1MyA2Ny41NTUyQzI5OC41MDYgNjguMDgyMyAyOTcuMTAzIDY4LjUwODkgMjk1LjQ0MiA2OC44MzVDMjkzLjc4NSA2OS4xOTM0IDI5Mi4wMjkgNjkuNDAwMiAyOTAuMTczIDY5LjQ1NTNDMjg5LjM2NCA2OS41MTc5IDI4OC42MDYgNjguOTA0NyAyODcuODk4IDY3LjYxNThDMjg3LjE5NSA2Ni4zNTkxIDI4Ni42MjMgNjQuOTcyNSAyODYuMTg0IDYzLjQ1NkMyODUuNzQgNjEuOTA3NCAyODUuMTA2IDYwLjU0NDUgMjg0LjI4MSA1OS4zNjc0QzI4My40NTMgNTguMTU4IDI4Mi41MSA1Ny42NDgyIDI4MS40NTUgNTcuODM3OEMyODAuOTQzIDU3LjkzMDggMjc5LjQ3OSA1OC4yNjY0IDI3Ny4wNjQgNTguODQ0N0MyNzQuNjc4IDU5LjM4NyAyNzIuNDM3IDU5Ljc4MTUgMjcwLjM0MyA2MC4wMjgxQzI2OS44OTIgNjAuMDgxMiAyNjkuMDM2IDYwLjE2NTYgMjY3Ljc3NSA2MC4yODEzQzI2Ni41MTEgNjAuMzY0OCAyNjUuNTc0IDYwLjQ1ODcgMjY0Ljk2NiA2MC41NjNDMjY0LjM4NiA2MC42MzEzIDI2My42NiA2MC44NDc1IDI2Mi43ODggNjEuMjExNUMyNjEuOTEyIDYxLjU0MzMgMjYxLjE4MiA2Mi4wMDQ5IDI2MC41OTkgNjIuNTk2NEMyNjAuMDE1IDYzLjE4NzkgMjU5LjQ0MiA2NC41NjIyIDI1OC44NzkgNjYuNzE5NEMyNTguMzE2IDY4Ljg3NjcgMjU3LjY2OCA3MC44NjQyIDI1Ni45MzQgNzIuNjgyMkMyNTYuMjM3IDc0LjUyODUgMjU1LjM2IDc1LjU0NjUgMjU0LjMwNCA3NS43MzYyQzI1My4wMDIgNzYuMDUyOCAyNTEuNjM4IDc2LjI2MjQgMjUwLjIxMyA3Ni4zNjQ5QzI0OC43OTEgNzYuNDk5NiAyNDcuNDczIDc2LjU0MDQgMjQ2LjI1OCA3Ni40ODc0QzI0NS4wNzkgNzYuNDYyOSAyNDQuMTQxIDc2LjEzMjIgMjQzLjQ0NSA3NS40OTUzQzI0Mi43NTMgNzQuODkwNyAyNDIuNDg2IDc0LjAwNzMgMjQyLjY0MyA3Mi44NDUzWk0yNjUuNjc5IDQ2LjIxODFDMjY0Ljc5NyA0Ny44OSAyNjUuMTkzIDQ4Ljg4OSAyNjYuODY0IDQ5LjIxNDlDMjY4LjMwMyA0OS41MDI5IDI3MS4yNzggNDkuMzgxNCAyNzUuNzkgNDguODUwM0MyNzYuNDAyIDQ4Ljc3ODIgMjc2LjkxOCA0OC43MTc1IDI3Ny4zMzcgNDguNjY4MkMyNzcuNzg4IDQ4LjYxNTEgMjc4LjE4NyA0OC41MzU0IDI3OC41MzQgNDguNDI5M0MyNzguODc3IDQ4LjI5MDkgMjc5LjE0NSA0OC4yMTAzIDI3OS4zMzggNDguMTg3NUMyNzkuNTYgNDguMTI4NyAyNzkuNzQyIDQ4LjAwOTMgMjc5Ljg4NCA0Ny44MjkyQzI4MC4wNTUgNDcuNjEzMSAyODAuMTY5IDQ3LjQ2OSAyODAuMjI1IDQ3LjM5N0MyODAuMjgyIDQ3LjMyNDkgMjgwLjMxIDQ3LjE0MiAyODAuMzA4IDQ2Ljg0ODJDMjgwLjMzNCA0Ni41MTg0IDI4MC4zMjQgNDYuMjkwOSAyODAuMjc3IDQ2LjE2NThDMjgwLjI1OCA0Ni4wMDQ3IDI4MC4yMjIgNDUuNjk4NSAyODAuMTY4IDQ1LjI0NzRDMjgwLjExMiA0NC43NjQgMjgwLjA2OCA0NC4zOTM0IDI4MC4wMzggNDQuMTM1NkMyNzkuODkzIDQyLjkxMTEgMjc5LjMxMiA0MS4xNjYyIDI3OC4yOTQgMzguOTAxMUMyNzcuMjc2IDM2LjYzNTkgMjc2LjM1NiAzNS4wNjE3IDI3NS41MzMgMzQuMTc4NEMyNzQuNjAyIDMzLjIwOTggMjczLjUzOCAzMi45MTA0IDI3Mi4zNCAzMy4yODAxQzI3MS4xNzQgMzMuNjQ2MSAyNzAuMzYxIDM0LjUwOTYgMjY5LjkgMzUuODcwNkMyNjkuNTM4IDM2Ljk1ODcgMjY5LjIxMyAzNy45NDQ1IDI2OC45MjUgMzguODI3OEMyNjguNjY5IDM5LjcwNzQgMjY4LjUyMSA0MC4yNDc3IDI2OC40NzkgNDAuNDQ4NkMyNjguNDY2IDQwLjYxMzUgMjY4LjMzIDQwLjk4ODkgMjY4LjA3MiA0MS41NzQ2QzI2Ny44MTUgNDIuMTYwNCAyNjcuNTUxIDQyLjY5NzggMjY3LjI4MiA0My4xODY5QzI2Ny4wMTMgNDMuNjc2IDI2Ni40NzggNDQuNjg2NCAyNjUuNjc5IDQ2LjIxODFaIiBmaWxsPSIjMkMyQTI4Ij48L3BhdGg+PHBhdGggZD0iTTE4MC4wNDIgNzIuOTM3N0MxNzguNjc5IDczLjAwMjYgMTc3LjYyNCA3Mi43OTE3IDE3Ni44NzggNzIuMzA1QzE3Ni4xNjQgNzEuODE4MyAxNzUuNzEgNzEuMTA0NSAxNzUuNTE1IDcwLjE2MzVDMTc1LjMyIDY5LjIyMjUgMTc1LjIyMyA2OC4wNzA2IDE3NS4yMjMgNjYuNzA3OEMxNzUuMjIzIDY1LjMxMjYgMTc1LjI3MiA2My43NTUxIDE3NS4zNjkgNjIuMDM1NEMxNzUuNDk5IDYwLjMxNTcgMTc1LjQ5OSA1OC40MzM4IDE3NS4zNjkgNTYuMzg5NkMxNzUuMDc3IDUxLjI2MjkgMTc0Ljg4MiA0Ny41ODAxIDE3NC43ODUgNDUuMzQxMkMxNzQuNzIgNDMuMTAyNCAxNzQuNzM2IDM5Ljk1NSAxNzQuODM0IDM1Ljg5OUMxNzQuOTYzIDMxLjgxMDcgMTc1LjMyIDI3LjU5MjUgMTc1LjkwNCAyMy4yNDQ2QzE3Ni40ODkgMTguODk2NiAxNzcuMzQ4IDEzLjYyMzkgMTc4LjQ4NCA3LjQyNjQ3QzE3OC45MDYgNS4wOTAyNiAxNzkuOTc3IDMuMzU0MzMgMTgxLjY5NiAyLjIxODY3QzE4My40MTYgMS4wODMwMSAxODUuMzk1IDAuNTk2MzAxIDE4Ny42MzQgMC43NTg1MzhDMTg5Ljg3MyAwLjkyMDc3NSAxOTIuMjQyIDEuNTg1OTUgMTk0Ljc0IDIuNzU0MDVDMTk3LjIzOSAzLjg4OTcxIDE5OS40NzcgNS40MTQ3NCAyMDEuNDU3IDcuMzI5MTNDMjAyLjc1NSA4LjU5NDU4IDIwNC4wODUgMTEuMDc2OCAyMDUuNDQ4IDE0Ljc3NThDMjA2LjQ1NCAxNy41MDE0IDIwNy4yIDE5LjEyMzggMjA3LjY4NyAxOS42NDI5QzIwOC40MzMgMjAuNDIxNiAyMDkuMzI1IDIwLjE2MjEgMjEwLjM2NCAxOC44NjQyQzIxMC43MiAxOC40MDk5IDIxMS4yMDcgMTcuODI1OSAyMTEuODI0IDE3LjExMkMyMTIuNDczIDE2LjM2NTcgMjEzLjMgMTUuNDA4NSAyMTQuMzA2IDE0LjI0MDRDMjE1LjM0NCAxMy4wNzIzIDIxNi40MzEgMTEuOTIwNCAyMTcuNTY3IDEwLjc4NDhDMjE4LjcwMyA5LjY0OTEyIDIxOS45MDMgOC40ODEwMSAyMjEuMTY5IDcuMjgwNDZDMjIyLjQzNCA2LjA3OTkxIDIyMy42ODMgNS4wNDE1OSAyMjQuOTE2IDQuMTY1NTFDMjI2LjE4MiAzLjI4OTQzIDIyNy4zNjYgMi41NTkzNyAyMjguNDY5IDEuOTc1MzJDMjI5LjYwNSAxLjM5MTI2IDIzMC42NDMgMS4xMTU0NiAyMzEuNTg0IDEuMTQ3OTFDMjMyLjU1OCAxLjE0NzkxIDIzMy4zMzYgMS40ODg2IDIzMy45MiAyLjE3QzIzNi4xNTkgNC44MzA2OCAyMzcuNjUyIDguOTM1MjggMjM4LjM5OCAxNC40ODM4QzIzOS4xNDQgMjAuMDMyMyAyMzkuMDggMjYuNzgxMyAyMzguMjAzIDM0LjczMDlDMjM4LjA0MSAzNi4wNjEzIDIzNy44MyAzNy43NjQ4IDIzNy41NzEgMzkuODQxNEMyMzcuMzQ0IDQxLjg4NTYgMjM3LjE4MSA0My4zNDU3IDIzNy4wODQgNDQuMjIxOEMyMzcuMDE5IDQ1LjA2NTQgMjM2LjkyMiA0Ni4yODIyIDIzNi43OTIgNDcuODcyMUMyMzYuNjYyIDQ5LjQ2MjEgMjM2LjU4MSA1MS4wODQ0IDIzNi41NDkgNTIuNzM5MkMyMzYuNTE2IDU0LjM5NDEgMjM2LjUgNTYuMzg5NiAyMzYuNSA1OC43MjU4QzIzNi41IDYxLjI4OTEgMjM2LjQwMyA2My40OTU1IDIzNi4yMDggNjUuMzQ1QzIzNi4wMTMgNjcuMTk0NSAyMzUuNzcgNjguNjIyMiAyMzUuNDc4IDY5LjYyODFDMjM1LjIxOCA3MC42MzQgMjM0Ljg0NSA3MS40Mjg5IDIzNC4zNTggNzIuMDEzQzIzMy45MDQgNzIuNjI5NSAyMzMuNDk5IDczLjAzNTEgMjMzLjE0MiA3My4yMjk4QzIzMi43ODUgNzMuNDI0NCAyMzIuMzMgNzMuNTcwNSAyMzEuNzc5IDczLjY2NzhDMjMwLjM1MSA3My45NTk4IDIyOS4xNTEgNzQuMTU0NSAyMjguMTc3IDc0LjI1MTlDMjI3LjIwNCA3NC4zNDkyIDIyNi4zMTEgNzQuMzQ5MiAyMjUuNSA3NC4yNTE5QzIyNC43MjIgNzQuMTg3IDIyNC4xMDUgNzMuOTkyMyAyMjMuNjUxIDczLjY2NzhDMjIzLjE5NyA3My4zNzU4IDIyMi43OTEgNzIuOTIxNSAyMjIuNDM0IDcyLjMwNUMyMjIuMTEgNzEuNzIxIDIyMS44OTkgNzAuOTkwOSAyMjEuODAxIDcwLjExNDhDMjIxLjcwNCA2OS4yMzg3IDIyMS42MzkgNjguMTg0MiAyMjEuNjA3IDY2Ljk1MTJDMjIxLjYwNyA2NS42ODU3IDIyMS42MzkgNjQuMjc0MyAyMjEuNzA0IDYyLjcxNjhDMjIxLjgwMSA2MS4xMjY5IDIyMS45MTUgNTkuMzA5OCAyMjIuMDQ1IDU3LjI2NTZDMjIyLjI3MiA1My44OTExIDIyMi40MzQgNTEuMjE0MiAyMjIuNTMxIDQ5LjIzNDlDMjIzLjAxOCAzOS44NTc2IDIyMi41OTYgMzMuMTczNSAyMjEuMjY2IDI5LjE4MjRDMjIwLjYxNyAyNy4zMDA1IDIxOS45NTIgMjYuNzAwMiAyMTkuMjcgMjcuMzgxNkMyMTkuMjA1IDI3LjQxNDEgMjE5LjE1NyAyNy40NjI3IDIxOS4xMjQgMjcuNTI3NkMyMTcuOTg5IDI4Ljk1NTMgMjE2Ljk4MyAzMC40MTU0IDIxNi4xMDcgMzEuOTA4QzIxNS4yNjMgMzMuNDAwNiAyMTQuNjYzIDM0LjUzNjMgMjE0LjMwNiAzNS4zMTVDMjEzLjk4MSAzNi4wNjEzIDIxMy4zODEgMzcuNTg2MyAyMTIuNTA1IDM5Ljg5MDFDMjExLjY2MSA0Mi4xOTM4IDIxMS4wNjEgNDMuODE2MiAyMTAuNzA0IDQ0Ljc1NzJDMjA4Ljc1NyA0OS43MjE2IDIwNy4wNTQgNTIuMDI1NCAyMDUuNTk0IDUxLjY2ODVDMjA0LjE2NiA1MS4zMTE2IDIwMi43MjIgNDguMjkzOSAyMDEuMjYyIDQyLjYxNTdDMTk5LjU3NSAzNi4xNTg2IDE5Ny42MjggMzEuMjc1MyAxOTUuNDIyIDI3Ljk2NTdDMTkzLjk2MSAyNS42OTQzIDE5Mi43MTIgMjQuNzA0NyAxOTEuNjc0IDI0Ljk5NjdDMTkwLjYzNiAyNS4yODg4IDE5MC4wMDMgMjYuOTI3MyAxODkuNzc2IDI5LjkxMjVDMTg5LjY0NiAzMS4zNzI2IDE4OS40ODQgMzMuMTU3MiAxODkuMjg5IDM1LjI2NjNDMTg5LjA5NCAzNy4zNDMgMTg4Ljk2NSAzOC44NjggMTg4LjkgMzkuODQxNEMxODguODM1IDQwLjgxNDggMTg4Ljc3IDQyLjA0NzggMTg4LjcwNSA0My41NDA0QzE4OC42NCA0NS4wMzMgMTg4LjYyNCA0Ni40NzY5IDE4OC42NTYgNDcuODcyMUMxODguNzIxIDQ5LjI2NzQgMTg4LjgxOSA1MC44NTczIDE4OC45NDggNTIuNjQxOUMxODkuMDEzIDUzLjU1MDQgMTg5LjEyNyA1NC43MTg1IDE4OS4yODkgNTYuMTQ2MkMxODkuNDg0IDU3LjU3MzkgMTg5LjY0NiA1OC43NzQ1IDE4OS43NzYgNTkuNzQ3OUMxODkuOTA2IDYwLjY4ODggMTg5Ljk4NyA2MS43OTIxIDE5MC4wMTkgNjMuMDU3NUMxOTAuMDUyIDY0LjI5MDUgMTg5Ljk4NyA2NS4zMjg4IDE4OS44MjQgNjYuMTcyNUMxODkuNjk1IDY2Ljk4MzYgMTg5LjQxOSA2Ny44NDM1IDE4OC45OTcgNjguNzUyQzE4OC41NzUgNjkuNjI4MSAxODcuOTkxIDcwLjM0MTkgMTg3LjI0NSA3MC44OTM1QzE4Ni41MzEgNzEuNDQ1MiAxODUuNTU4IDcxLjg5OTQgMTg0LjMyNSA3Mi4yNTYzQzE4My4xMjQgNzIuNjQ1NyAxODEuNjk2IDcyLjg3MjggMTgwLjA0MiA3Mi45Mzc3WiIgZmlsbD0iIzJDMkEyOCI+PC9wYXRoPjxwYXRoIGQ9Ik0xNTAuNzM4IDc0LjkyNzlDMTUwLjI1MiA3My41MDAyIDE0OS43MTYgNzEuMzc0OSAxNDkuMTMyIDY4LjU1MkMxNDguNTQ4IDY1LjY5NjYgMTQ3LjYwNyA2Mi45NzEgMTQ2LjMwOSA2MC4zNzUyQzE0NS43OSA1OS4zMDQ1IDE0NS40MTcgNTguNTU4MiAxNDUuMTkgNTguMTM2NEMxNDQuOTYzIDU3LjcxNDYgMTQ0LjU1NyA1Ny4wNjU2IDE0My45NzMgNTYuMTg5NUMxNDMuNDIyIDU1LjMxMzQgMTQyLjkxOSA1NC42OTY5IDE0Mi40NjQgNTQuMzRDMTQyLjA0MyA1My45NTA3IDE0MS40NzUgNTMuNjEgMTQwLjc2MSA1My4zMTc5QzE0MC4wNDcgNTMuMDI1OSAxMzkuMzAxIDUyLjkxMjMgMTM4LjUyMiA1Mi45NzcyQzEzNy40NTEgNTMuMDc0NiAxMzYuNTU5IDUzLjQ5NjQgMTM1Ljg0NSA1NC4yNDI3QzEzNS4xNjQgNTQuOTU2NSAxMzQuNjYxIDU1Ljg5NzUgMTM0LjMzNiA1Ny4wNjU2QzEzNC4wNDQgNTguMjAxMyAxMzMuODMzIDU5LjI4ODIgMTMzLjcwNCA2MC4zMjY2QzEzMy41NzQgNjEuMzMyNCAxMzMuNDc2IDYyLjQzNTYgMTMzLjQxMiA2My42MzYyQzEzMy4zNzkgNjQuODA0MyAxMzMuMzMgNjUuNTY2OCAxMzMuMjY1IDY1LjkyMzdDMTMyLjk3MyA2Ny41NDYxIDEzMi44OTIgNjkuMDU0OSAxMzMuMDIyIDcwLjQ1MDFDMTMzLjE4NCA3MS44MTI5IDEzMy4yODIgNzMuMDQ1OSAxMzMuMzE0IDc0LjE0OTFDMTMzLjM0NyA3NS4yODQ4IDEzMy4yNDkgNzYuMjQyIDEzMy4wMjIgNzcuMDIwN0MxMzIuNzk1IDc3Ljc5OTUgMTMyLjE3OSA3OC4zODM1IDEzMS4xNzMgNzguNzcyOUMxMzAuMTk5IDc5LjE5NDcgMTI4LjczOSA3OS4zODk0IDEyNi43OTIgNzkuMzU2OUMxMjMuNzQyIDc5LjMyNDUgMTIxLjkwOSA3OC4xNDAyIDEyMS4yOTIgNzUuODA0QzEyMC43MDggNzMuNTAwMiAxMjAuNzI1IDY5LjM2MzIgMTIxLjM0MSA2My4zOTI4QzEyMS41MzYgNjAuMzc1MiAxMjEuNjgyIDU3Ljk1NzkgMTIxLjc3OSA1Ni4xNDA5QzEyMS45NDEgNTIuOTYxIDEyMi4wMjIgNDguODU2NCAxMjIuMDIyIDQzLjgyNzFDMTIyLjAyMiAzOC43OTc3IDEyMi4zMzEgMzIuOTI0OCAxMjIuOTQ3IDI2LjIwODFDMTIzLjE0MiAyMy45MzY4IDEyMy4xMjYgMjEuODYwMiAxMjIuODk5IDE5Ljk3ODNDMTIyLjY3MSAxOC4wOTYzIDEyMi4zOTYgMTYuNzE3MyAxMjIuMDcxIDE1Ljg0MTJDMTIxLjc3OSAxNC45NjUxIDEyMS42ODIgMTQuMDI0MiAxMjEuNzc5IDEzLjAxODNDMTIxLjkwOSAxMS45OCAxMjIuMzYzIDEwLjkwOTIgMTIzLjE0MiA5LjgwNkMxMjMuOTUzIDguNzAyNzkgMTI2LjMzOCA3Ljk3MjcyIDEzMC4yOTcgNy42MTU4QzEzNC4yNTUgNy4yMjY0MyAxMzcuNjk1IDcuMDgwNDIgMTQwLjYxNSA3LjE3Nzc2QzE0NC4zNDYgNy4yNzUxIDE0Ny4yOTkgNy42NDgyNSAxNDkuNDczIDguMjk3MkMxNTEuNjQ3IDguOTQ2MTQgMTU1LjYzOCAxMC43NDcgMTYxLjQ0NiAxMy42OTk3QzE2NC4wNDIgMTUuMDMgMTY1Ljg3NSAxNi41NTUxIDE2Ni45NDYgMTguMjc0OEMxNjguMDE3IDE5Ljk5NDUgMTY4LjI2IDIyLjEzNiAxNjcuNjc2IDI0LjY5OTNDMTY3LjA5MiAyNy4yNjI3IDE2NS41NTEgMzAuMTk5MiAxNjMuMDUyIDMzLjUwODhDMTYyLjUzMyAzNC4xOTAyIDE2MS42MDggMzUuMDE3NiAxNjAuMjc4IDM1Ljk5MUMxNTguOTQ4IDM2Ljk2NDUgMTU3LjY5OCAzNy44MjQzIDE1Ni41MyAzOC41NzA2QzE1NS4zOTUgMzkuMzE2OSAxNTQuNDcgNDAuMTc2NyAxNTMuNzU2IDQxLjE1MDJDMTUzLjA0MiA0Mi4xMjM2IDE1Mi44OTYgNDMuMDE1OSAxNTMuMzE4IDQzLjgyNzFDMTU0LjA5NyA0NS4zNTIxIDE1NS4wODYgNDcuMDM5NCAxNTYuMjg3IDQ4Ljg4ODlDMTU3LjQ4NyA1MC43MDU5IDE1OC41MSA1Mi40NDE4IDE1OS4zNTMgNTQuMDk2N0MxNjAuMTk3IDU1LjcxOSAxNjAuOTI3IDU3LjY4MjEgMTYxLjU0MyA1OS45ODU5QzE2Mi4xMjcgNjIuMTU5OCAxNjIuNjYzIDYzLjk3NjkgMTYzLjE1IDY1LjQzN0MxNjMuNjY5IDY2Ljg5NzIgMTY0LjAwOSA2Ny44MzgxIDE2NC4xNzIgNjguMjU5OUMxNjQuMzY2IDY4LjY4MTggMTY0LjU0NSA2OS4zMzA3IDE2NC43MDcgNzAuMjA2OEMxNjQuOTAyIDcxLjA4MjkgMTY1LjA4IDcyLjQxMzIgMTY1LjI0MiA3NC4xOTc4QzE2NS4zNzIgNzUuNjI1NSAxNjUuMzA3IDc2LjgwOTggMTY1LjA0OCA3Ny43NTA4QzE2NC44MjEgNzguNzI0MiAxNjQuMzk5IDc5LjQ3MDUgMTYzLjc4MiA3OS45ODk3QzE2My4xNjYgODAuNTA4OCAxNjIuNTE3IDgwLjg2NTcgMTYxLjgzNSA4MS4wNjA0QzE2MS4xNTQgODEuMjg3NiAxNjAuMjk0IDgxLjQ0OTggMTU5LjI1NiA4MS41NDcxQzE1Ny42NjYgODEuODA2NyAxNTYuMzg0IDgxLjg1NTQgMTU1LjQxMSA4MS42OTMyQzE1NC40MzcgODEuNTYzNCAxNTMuNjI2IDgxLjAyOCAxNTIuOTc3IDgwLjA4N0MxNTIuMzYxIDc5LjE3ODUgMTUxLjYxNCA3Ny40NTg4IDE1MC43MzggNzQuOTI3OVpNMTUwLjE1NCAyMi43NTI1QzE0OC43NTkgMjEuMjU5OSAxNDcuMTM3IDIwLjE1NjcgMTQ1LjI4NyAxOS40NDI5QzE0My40MzggMTguNjk2NiAxNDEuOTYxIDE4LjYxNTUgMTQwLjg1OCAxOS4xOTk1QzE0MC4zNzEgMTkuNDU5MSAxNDAuMDQ3IDE5Ljg4MDkgMTM5Ljg4NSAyMC40NjVDMTM5Ljc1NSAyMS4wMTY2IDEzOS42NzQgMjEuODQ0IDEzOS42NDEgMjIuOTQ3MkMxMzkuNjQxIDI0LjAxOCAxMzkuNTkzIDI0Ljg2MTYgMTM5LjQ5NSAyNS40NzgxQzEzOS40NjMgMjUuNjcyOCAxMzkuMzk4IDI2LjA2MjEgMTM5LjMwMSAyNi42NDYyQzEzOS4yMDMgMjcuMjMwMiAxMzkuMTM4IDI3LjY2ODMgMTM5LjEwNiAyNy45NjAzQzEzOS4wNzQgMjguMjE5OSAxMzkuMDQxIDI4LjYyNTUgMTM5LjAwOSAyOS4xNzcxQzEzOC45NzYgMjkuNjk2MiAxMzguOTkyIDMwLjEwMTggMTM5LjA1NyAzMC4zOTM5QzEzOS4xNTUgMzAuNjg1OSAxMzkuMjg0IDMxLjAxMDQgMTM5LjQ0NyAzMS4zNjczQzEzOS42MDkgMzEuNzI0MiAxMzkuODUyIDMyLjAxNjIgMTQwLjE3NyAzMi4yNDM0QzE0MC41MDEgMzIuNDcwNSAxNDAuODkxIDMyLjY0OSAxNDEuMzQ1IDMyLjc3ODdDMTQyLjYxIDMzLjEwMzIgMTQ0LjAzOCAzMy4wNTQ1IDE0NS42MjggMzIuNjMyN0MxNDcuMjUgMzIuMTc4NSAxNDguNjI5IDMxLjQ4MDggMTQ5Ljc2NSAzMC41Mzk5QzE1MC45MDEgMjkuNTY2NSAxNTEuNTk4IDI4LjQxNDYgMTUxLjg1OCAyNy4wODQyQzE1Mi4xNSAyNS43MjE0IDE1MS41ODIgMjQuMjc3NSAxNTAuMTU0IDIyLjc1MjVaIiBmaWxsPSIjMkMyQTI4Ij48L3BhdGg+PHBhdGggZD0iTTc0LjI4NzcgNjYuNDEwM0M3My45OTU3IDY0Ljg4NTMgNzMuNzM2MSA2MC42NTA5IDczLjUwOSA1My43MDcyQzczLjMxNDMgNDYuNzMxIDczLjAwNiA0MS4xOTg3IDcyLjU4NDIgMzcuMTEwM0M3Mi4yMjczIDMzLjgzMzIgNzIuMDQ4OCAzMC43OTkzIDcyLjA0ODggMjguMDA4OUM3Mi4wODEzIDI1LjE4NTkgNzIuMjExMSAyMi43MzYyIDcyLjQzODIgMjAuNjU5NUM3Mi42NjUzIDE4LjU4MjkgNzMuMTM1OCAxNi42Njg1IDczLjg0OTcgMTQuOTE2M0M3NC41NjM1IDEzLjE2NDIgNzUuMjEyNCAxMS43MjAzIDc1Ljc5NjUgMTAuNTg0NkM3Ni4zODA2IDkuNDE2NSA3Ny4yNzI5IDguMzI5NTIgNzguNDczNCA3LjMyMzY1Qzc5LjY3NCA2LjMxNzc4IDgwLjYzMTIgNS41NTUyNyA4MS4zNDUgNS4wMzYxMUM4Mi4wOTEzIDQuNDg0NSA4My4yMTA3IDMuOTMyOSA4NC43MDMzIDMuMzgxMjlDODYuMTk1OSAyLjgyOTY5IDg3LjI4MjkgMi40NTY1NCA4Ny45NjQzIDIuMjYxODZDODguNjc4MSAyLjA2NzE3IDg5LjgxMzggMS43NzUxNSA5MS4zNzEyIDEuMzg1NzhDOTMuMDkxIDAuOTYzOTYzIDk0LjM1NjQgMC42MjMyNjUgOTUuMTY3NiAwLjM2MzY4NkM5OS45MDQ5IC0xLjA5NjQ1IDEwNC41OTQgMS44NDAwNCAxMDkuMjM0IDkuMTczMTVDMTEwLjc1OSAxMS42MDY3IDExMS43NjQgMTQuMTM3NiAxMTIuMjUxIDE2Ljc2NThDMTEyLjczOCAxOS4zNjE2IDExMy4wMTQgMjIuNTU3NyAxMTMuMDc5IDI2LjM1NEMxMTMuMTExIDI4LjU2MDUgMTEzLjI0MSAzMS4xNzI1IDExMy40NjggMzQuMTkwMUMxMTMuNjk1IDM3LjE3NTIgMTEzLjg1NyAzOS42MjUgMTEzLjk1NSA0MS41Mzk0QzExNC4wNTIgNDMuNDUzOCAxMTQuMDM2IDQ1LjU0NjcgMTEzLjkwNiA0Ny44MThDMTEzLjgwOSA1MC4wNTY4IDExMy40MTkgNTIuMTk4NCAxMTIuNzM4IDU0LjI0MjZDMTEyLjA4OSA1Ni4yNTQzIDExMS4xMzIgNTguMjMzNiAxMDkuODY2IDYwLjE4MDRDMTA5LjE1MiA2MS4yODM2IDEwOC4yMTEgNjMuMDY4MiAxMDcuMDQzIDY1LjUzNDJDMTA1LjkwOCA2Ny45Njc4IDEwNC42NTggNzAuMjIyOSAxMDMuMjk2IDcyLjI5OTVDMTAxLjkzMyA3NC40MDg2IDEwMC4yNjIgNzYuMjkwNSA5OC4yODI1IDc3Ljk0NTRDOTYuNDY1NSA3OS40NzA0IDk0LjUxODYgODAuNDQzOCA5Mi40NDIgODAuODY1NkM5MC4zNjU0IDgxLjMxOTkgODguMzY5OSA4MS4yMzg4IDg2LjQ1NTUgODAuNjIyM0M4NC41NDExIDgwLjAzODIgODIuNzQwMiA3OS4wOTcyIDgxLjA1MyA3Ny43OTk0Qzc5LjM5ODIgNzYuNTMzOSA3Ny45NzA1IDc0Ljg5NTMgNzYuNzY5OSA3Mi44ODM2Qzc1LjU2OTQgNzAuODcxOCA3NC43NDIgNjguNzE0MSA3NC4yODc3IDY2LjQxMDNaTTkyLjUzOTMgNjYuOTQ1N0M5My4zMTgxIDY2LjUyMzkgOTMuOTk5NSA2NS41MzQyIDk0LjU4MzUgNjMuOTc2OEM5NS4yIDYyLjM4NjggOTUuNzY3OSA2MC4zMTAyIDk2LjI4NyA1Ny43NDY5Qzk2LjgwNjIgNTUuMTgzNSA5Ny4wNjU4IDUzLjg4NTYgOTcuMDY1OCA1My44NTMyQzk3LjI5MjkgNTMuMDA5NiA5Ny41NTI1IDUyLjA4NDggOTcuODQ0NSA1MS4wNzg5Qzk4LjE2OSA1MC4wNDA2IDk4LjQyODUgNDkuMjI5NCA5OC42MjMyIDQ4LjY0NTRDOTguODE3OSA0OC4wMjg5IDk5LjAyODggNDcuMjY2NCA5OS4yNTYgNDYuMzU3OEM5OS41MTU1IDQ1LjQxNjkgOTkuNjYxNSA0NC42MjE5IDk5LjY5NCA0My45NzNDOTkuNzU4OSA0My4yOTE2IDk5LjgwNzYgNDIuMzgzIDk5Ljg0IDQxLjI0NzRDOTkuOTA0OSA0MC4xMTE3IDk5Ljg1NjIgMzkuMDQxIDk5LjY5NCAzOC4wMzUxQzk5LjE3NDggMzMuMjMyOSA5OS4wMjg4IDI3LjA1MTcgOTkuMjU2IDE5LjQ5MTRDOTkuMzUzMyAxNi42MzYgOTguNDc3MiAxNC45MTYzIDk2LjYyNzcgMTQuMzMyM0M5NC45NzI5IDEzLjg0NTYgOTMuMjA0NSAxNC4zNjQ3IDkxLjMyMjYgMTUuODg5OEM4OC45MjE1IDE3LjgwNDIgODcuNTQyNSAyMC40MTYyIDg3LjE4NTUgMjMuNzI1OEM4Ny4wNTU3IDI0LjYzNDMgODcuMDM5NSAyNS41NzUzIDg3LjEzNjkgMjYuNTQ4N0M4Ny41OTExIDMzLjAzODIgODcuNzA0NyAzNy40NjczIDg3LjQ3NzYgMzkuODM1OUM4Ny4yNTA0IDQyLjIwNDYgODYuOTA5NyA0NC44MTY2IDg2LjQ1NTUgNDcuNjcyQzg2LjAwMTIgNTAuNDk0OSA4NS43OTAzIDUzLjE1NTYgODUuODIyNyA1NS42NTRDODUuODU1MiA1Ni42OTIzIDg1LjkwMzkgNTcuNzE0NCA4NS45Njg4IDU4LjcyMDNDODYuMDY2MSA1OS42OTM3IDg2LjIxMjEgNjAuNzE1OCA4Ni40MDY4IDYxLjc4NjZDODYuNjMzOSA2Mi44NTczIDg2LjkwOTcgNjMuNzY1OSA4Ny4yMzQyIDY0LjUxMjJDODcuNTU4NyA2NS4yNTg0IDg3Ljk2NDMgNjUuOTM5OCA4OC40NTEgNjYuNTU2M0M4OC45Mzc3IDY3LjE0MDQgODkuNTIxNyA2Ny40NDg2IDkwLjIwMzEgNjcuNDgxMUM5MC44ODQ1IDY3LjUxMzUgOTEuNjYzMyA2Ny4zMzUxIDkyLjUzOTMgNjYuOTQ1N1oiIGZpbGw9IiMyQzJBMjgiPjwvcGF0aD48cGF0aCBkPSJNMC4wNDQ5MjcxIDY1LjQ4NTlDMC40MDE4NDggNjAuNzQ4NSAwLjc3NDk5MyA1Ny4zMjUzIDEuMTY0MzYgNTUuMjE2M0MxLjU4NjE4IDUzLjA3NDcgMi40OTQ3IDQ5LjY4NCAzLjg4OTk0IDQ1LjA0NEM0LjQwOTEgNDMuMzI0MyA0LjcxNzM1IDQwLjc0NDcgNC44MTQ2OSAzNy4zMDUzQzQuOTEyMDMgMzMuODMzNCA0Ljg5NTgxIDMwLjU3MjUgNC43NjYwMiAyNy41MjI0QzQuNjM2MjMgMjQuNDM5OSA0LjcwMTEzIDIxLjU1MjEgNC45NjA3MSAxOC44NTlDNS4yMjAyOCAxNi4xNjU4IDUuNzU1NjcgMTQuNDk0OCA2LjU2Njg1IDEzLjg0NTlDOC44MzgxNyAxMi4wNjEyIDExLjI3MTcgMTEuMTM2NSAxMy44Njc1IDExLjA3MTZDMTYuNDk1NyAxMC45NzQzIDE4LjkxMzEgMTEuNTkwOCAyMS4xMTk1IDEyLjkyMTFDMjMuMzI1OSAxNC4yNTE0IDI1LjE0MyAxNi4wNTIzIDI2LjU3MDcgMTguMzIzNkMyNy44MzYxIDIwLjMwMjkgMjkuNzUwNSAyMi45Nzk4IDMyLjMxMzggMjYuMzU0M0MzNC45MDk2IDI5LjcyODggMzcuMzU5NCAzMy40NzY1IDM5LjY2MzIgMzcuNTk3M0M0MS4xMjMzIDQwLjI1OCA0Mi4yNDI3IDQxLjg4MDQgNDMuMDIxNSA0Mi40NjQ0QzQ0LjY3NjMgNDMuNzI5OSA0Ni4wNzE1IDQyLjM1MDkgNDcuMjA3MiAzOC4zMjc0QzQ3LjQzNDMgMzcuNTQ4NyA0Ny42NDUyIDM2LjY4ODggNDcuODM5OSAzNS43NDc4QzQ4LjQyNCAzMi45ODk4IDQ4Ljk5MTggMzAuNTA3NiA0OS41NDM0IDI4LjMwMTJDNTAuMDk1IDI2LjA5NDcgNTAuNDUxOSAyNC42NTA4IDUwLjYxNDIgMjMuOTY5NEM1MC44MDg4IDIzLjI1NTYgNTAuOTU0OSAyMi4zNDcxIDUxLjA1MjIgMjEuMjQzOUM1MS4xNDk1IDIwLjE0MDYgNTEuMTk4MiAxOC41NTA3IDUxLjE5ODIgMTYuNDc0MUM1MS4xOTgyIDE1LjIwODYgNTEuNDc0IDE0LjEyMTcgNTIuMDI1NiAxMy4yMTMxQzUyLjU3NzIgMTIuMzA0NiA1My4xNzc1IDExLjYyMzIgNTMuODI2NSAxMS4xNjg5QzU0LjUwNzkgMTAuNzE0NyA1NS40MTY0IDEwLjM1NzggNTYuNTUyIDEwLjA5ODJDNTcuNjg3NyA5LjgwNjE1IDU4LjUzMTMgOS42Mjc2OSA1OS4wODI5IDkuNTYyOEM1OS42NjcgOS40OTc5IDYwLjQxMzMgOS40NDkyMyA2MS4zMjE4IDkuNDE2NzhDNjIuNTg3MiA5LjM1MTg5IDYzLjQ2MzMgOS44NzEwNSA2My45NSAxMC45NzQzQzY0LjQzNjcgMTIuMDc3NSA2NC44MjYxIDE0LjMzMjYgNjUuMTE4MSAxNy43Mzk1QzY1LjE4MyAxOC41ODMyIDY1LjIzMTcgMTkuMzk0NCA2NS4yNjQyIDIwLjE3MzFDNjUuMjk2NiAyMC45MTk0IDY1LjI5NjYgMjEuNjk4MSA2NS4yNjQyIDIyLjUwOTNDNjUuMjMxNyAyMy4yODggNjUuMTk5MyAyMy45NTMyIDY1LjE2NjggMjQuNTA0OEM2NS4xNjY4IDI1LjAyNCA2NS4wODU3IDI1LjcwNTQgNjQuOTIzNSAyNi41NDlDNjQuNzkzNyAyNy4zNjAyIDY0LjY5NjMgMjcuOTYwNSA2NC42MzE0IDI4LjM0OThDNjQuNTY2NSAyOC43MzkyIDY0LjQyMDUgMjkuNDA0NCA2NC4xOTM0IDMwLjM0NTNDNjMuOTY2MyAzMS4yNTM5IDYzLjgyMDIgMzEuODU0MSA2My43NTU0IDMyLjE0NjJDNjMuNjkwNSAzMi40MDU4IDYzLjUxMiAzMy4wODcxIDYzLjIyIDM0LjE5MDRDNjIuOTI3OSAzNS4yNjExIDYyLjc0OTUgMzUuOTI2MyA2Mi42ODQ2IDM2LjE4NTlDNjEuODczNCAzOS4yMDM1IDYxLjQzNTQgNDIuODUzOCA2MS4zNzA1IDQ3LjEzNjlDNjEuMzM4IDUxLjM4NzUgNjEuMjczMSA1NS42MDU2IDYxLjE3NTggNTkuNzkxM0M2MS4wNzg0IDYzLjk3NzEgNjAuNTQzMSA2Ny42MTEyIDU5LjU2OTYgNzAuNjkzN0M1OS4xODAzIDcxLjkyNjcgNTguNzU4NSA3Mi45MTYzIDU4LjMwNDIgNzMuNjYyNkM1Ny44ODI0IDc0LjQwODkgNTcuNDQ0MyA3NS4wMDkyIDU2Ljk5MDEgNzUuNDYzNEM1Ni41NjgzIDc1LjkxNzcgNTUuODg2OSA3Ni4yMjU5IDU0Ljk0NTkgNzYuMzg4MkM1NC4wMDQ5IDc2LjU4MjkgNTMuMTI4OCA3Ni42OTY0IDUyLjMxNzcgNzYuNzI4OUM1MS41Mzg5IDc2Ljc5MzggNTAuMjU3MiA3Ni44MjYyIDQ4LjQ3MjYgNzYuODI2MkM0Ny4xNzQ3IDc2LjgyNjIgNDQuOTAzNCA3NS4yODUgNDEuNjU4NyA3Mi4yMDI1QzM4LjQ0NjQgNjkuMTIgMzUuOTQ4IDY1Ljc0NTQgMzQuMTYzMyA2Mi4wNzg5QzMzLjE4OTkgNjAuMDY3MSAzMS45MDgzIDU3Ljg0NDUgMzAuMzE4MyA1NS40MTA5QzI4LjcyODQgNTIuOTc3NCAyNi44Nzg5IDUwLjY3MzYgMjQuNzY5OCA0OC40OTk3QzIyLjY2MDggNDYuMzI1NyAyMC44OTI0IDQ1LjIzODcgMTkuNDY0NyA0NS4yMzg3QzE4LjI2NDEgNDUuMjM4NyAxNy4zNTU2IDQ2LjMyNTcgMTYuNzM5MSA0OC40OTk3QzE2LjE1NTEgNTAuNjczNiAxNS40ODk5IDU0LjAzMTkgMTQuNzQzNiA1OC41NzQ2QzEzLjk5NzMgNjMuMDg0OCAxMy4xMzc0IDY2Ljg4MTEgMTIuMTY0IDY5Ljk2MzZDMTEuODcyIDcwLjkzNyAxMS4zMzY2IDcxLjY4MzMgMTAuNTU3OSA3Mi4yMDI1QzkuNzc5MTQgNzIuNjg5MiA5LjExMzk3IDcyLjk2NSA4LjU2MjM2IDczLjAyOTlDOC4wMTA3NiA3My4xMjcyIDcuMDg2MDEgNzMuMjA4MyA1Ljc4ODExIDczLjI3MzJDNS41Mjg1MyA3My4zMDU3IDUuMzMzODUgNzMuMzIxOSA1LjIwNDA2IDczLjMyMTlDMy43MTE0OCA3My40MTkyIDIuNDI5ODEgNzIuODAyNyAxLjM1OTA1IDcxLjQ3MjRDMC4yODgyODMgNzAuMTA5NiAtMC4xNDk3NTcgNjguMTE0MSAwLjA0NDkyNzEgNjUuNDg1OVoiIGZpbGw9IiMyQzJBMjgiPjwvcGF0aD48L3N2Zz4K");

  --mono:       "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --serif:      "Newsreader", "Iowan Old Style", Georgia, serif;

  --gutter:   clamp(24px, 5vw, 88px);
  --col-gap:  clamp(20px, 2.5vw, 36px);
  --row-pad:  clamp(96px, 14vh, 160px);
  --row-pad-l: clamp(120px, 18vh, 200px);

  /* Max content width - beyond this, side padding grows so content
     stays centered instead of leaning left. Full-width backgrounds
     and hairline dividers are unaffected. */
  --content-max: 1600px;
  --pad-x: max(var(--gutter), (100% - var(--content-max)) / 2);
}

/* ============ RESET ============ */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
html { scroll-behavior: smooth; }

/* ============ BASE ============ */
body {
  background: var(--cream);
  color: var(--ink);
  font-family: var(--mono);
  font-weight: 400;
  font-size: 14px;
  line-height: 1.7;
  letter-spacing: -0.005em;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Film-grain overlay */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 100;
  opacity: 0.05;
  mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.10 0 0 0 0 0.097 0 0 0 0 0.086 0 0 0 1 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  background-size: 240px 240px;
}

::selection { background: var(--ink); color: var(--cream); }

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ============ NAV ============ */
.nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 50;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 24px var(--pad-x);
  border-bottom: 1px solid transparent;
  opacity: 0;
  pointer-events: none;
  transition: opacity 320ms ease, background 320ms ease, border-color 320ms ease;
}
.nav.scrolled {
  opacity: 1;
  pointer-events: auto;
  background: rgba(244, 239, 230, 0.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom-color: var(--hairline);
}
.nav .wordmark img { width: auto; height: 22px; display: block; }
.nav .links {
  display: flex;
  align-items: center;
  gap: clamp(20px, 3vw, 36px);
}
.nav .links a {
  font-family: var(--mono);
  font-weight: 500;
  font-size: 12px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--ink);
  text-decoration: none;
  position: relative;
}
.nav .links a::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -6px;
  height: 1px;
  background: var(--ink);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 280ms cubic-bezier(0.22, 0.61, 0.36, 1);
}
.nav .links a:hover::after { transform: scaleX(1); }

/* ============ HERO - three-stage scroll reveal ============
   Stage 1 (load):      cream bg + dark-grey solid NORMA wordmark
   Stage 2 (~25% scroll): solid wordmark fades; cabin photo shows through cutout
   Stage 3 (full scroll): cream cover fades; photo becomes full bleed
*/
.hero-shell {
  position: relative;
  height: 220vh;
  background: var(--cream);
}
.hero-stage {
  position: sticky;
  top: 0;
  height: 100vh;
  width: 100%;
  overflow: hidden;
  background: var(--cream);
}

/* Layer 1 - full-bleed photo (always present, revealed as layers above fade) */
.hero-photo-bleed {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block;
  background-color: var(--cream-soft);
}
.hero-photo-bleed img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center 50%;
}

/* Layer 2 - cream cover with wordmark cut out via CSS mask. Fades last. */
.hero-cream-cover {
  position: absolute;
  inset: 0;
  z-index: 2;
  background: var(--cream);
  will-change: opacity;
  --mark-w: min(64vw, 880px);
  --mark-h: calc(min(64vw, 880px) * 82 / 303);
  -webkit-mask-image: linear-gradient(#000, #000), var(--wordmark-mask);
          mask-image: linear-gradient(#000, #000), var(--wordmark-mask);
  -webkit-mask-repeat: no-repeat, no-repeat;
          mask-repeat: no-repeat, no-repeat;
  -webkit-mask-position: center, center;
          mask-position: center, center;
  -webkit-mask-size: 100% 100%, var(--mark-w) var(--mark-h);
          mask-size: 100% 100%, var(--mark-w) var(--mark-h);
  -webkit-mask-composite: source-out;
          mask-composite: exclude;
}

/* Layer 3 - solid dark-grey wordmark on top. Fades first. */
.hero-wordmark-solid {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 3;
  display: block;
  width: min(64vw, 880px);
  height: auto;
  transform: translate(-50%, -50%);
  will-change: opacity;
  pointer-events: none;
}

/* Masthead - utility row above the wordmark */
.masthead {
  position: absolute;
  top: clamp(24px, 4vw, 40px);
  left: var(--pad-x);
  right: var(--pad-x);
  z-index: 5;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: var(--mono);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--ink-quiet);
  pointer-events: none;
  opacity: 0;
  animation: fadeIn 800ms cubic-bezier(0.22, 0.61, 0.36, 1) 1.0s forwards;
  transition: color 400ms ease;
}
.masthead .center { letter-spacing: 0.32em; }
.hero-shell[data-revealed="true"] .masthead {
  color: rgba(244, 239, 230, 0.85);
  mix-blend-mode: difference;
}

/* Hero foot - editorial subtitle row */
.hero-foot {
  position: absolute;
  left: var(--pad-x);
  right: var(--pad-x);
  bottom: clamp(32px, 5vw, 56px);
  z-index: 5;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: end;
  gap: clamp(20px, 4vw, 60px);
  pointer-events: none;
  opacity: 0;
  animation: fadeUp 900ms cubic-bezier(0.22, 0.61, 0.36, 1) 1.3s forwards;
  transition: color 400ms ease;
}
.hero-foot .where {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(20px, 2.4vw, 32px);
  line-height: 1.15;
  color: var(--ink);
  margin: 0;
  max-width: 20ch;
  transition: color 400ms ease;
}
.hero-foot .meta {
  font-family: var(--mono);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--ink);
  text-align: right;
  line-height: 1.7;
  white-space: pre-line;
  transition: color 400ms ease;
}
.hero-shell[data-revealed="true"] .hero-foot .where,
.hero-shell[data-revealed="true"] .hero-foot .meta {
  color: var(--cream);
  text-shadow: 0 1px 12px rgba(0, 0, 0, 0.45);
}

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeIn {
  to { opacity: 1; }
}

/* ============ DEK / LEDE ============ */
.dek {
  padding: var(--row-pad) var(--pad-x);
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--col-gap);
  align-items: start;
  border-bottom: 1px solid var(--hairline);
}
.dek > *:first-child { grid-column: 1 / span 3; }
.dek > *:last-child  { grid-column: 4 / -1; }
.dek .label {
  font-family: var(--mono);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--ink-quiet);
  margin: 6px 0 0;
}
.dek h2 {
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(32px, 4.4vw, 64px);
  line-height: 1.1;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0;
  max-width: 28ch;
  text-wrap: balance;
}
.dek h2 em { font-style: italic; }

/* ============ SPREAD - magazine layout ============ */
.spread {
  padding: var(--row-pad) var(--pad-x);
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--col-gap);
  align-items: start;
  border-bottom: 1px solid var(--hairline);
}
.spread .chapter {
  grid-column: 1 / span 2;
  font-family: var(--mono);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--ink-quiet);
  margin: 6px 0 0;
}
.spread .chapter .num {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: 36px;
  letter-spacing: 0;
  text-transform: none;
  display: block;
  color: var(--ink);
  margin-bottom: 6px;
}
.spread .headline {
  grid-column: 4 / span 8;
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(36px, 5vw, 76px);
  line-height: 1.04;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0 0 clamp(40px, 5vw, 64px);
  max-width: 16ch;
  text-wrap: balance;
}
.spread .headline em { font-style: italic; }
.spread .photo {
  grid-column: 1 / span 6;
  aspect-ratio: 4 / 5;
  background-color: var(--cream-soft);
  overflow: hidden;
}
.spread .photo picture,
.spread .photo img,
.spread .photo video {
  width: 100%;
  height: 100%;
  display: block;
}
.spread .photo img,
.spread .photo video {
  object-fit: cover;
  object-position: center;
}
.spread .photo .cabin-photo { object-position: center 30%; }
.spread .body {
  grid-column: 9 / span 4;
  font-family: var(--mono);
  font-weight: 400;
  font-size: 16px;
  line-height: 1.7;
  color: var(--ink);
  max-width: 38ch;
  align-self: end;
}
.spread .body p { margin: 0 0 1.4em; }
.spread .body .caption {
  margin-top: 32px;
  padding-top: 16px;
  border-top: 1px solid var(--hairline);
  font-family: var(--serif);
  font-style: italic;
  font-size: 14px;
  color: var(--ink-quiet);
  line-height: 1.5;
}

/* Alternate orientation - photo right, text left */
.spread.alt .photo { grid-column: 7 / span 6; aspect-ratio: 4 / 5; }
.spread.alt .body  { grid-column: 1 / span 4; align-self: start; padding-top: 8px; }

/* ============ HORIZONTAL PHOTO GALLERY ============ */
.gallery {
  position: relative;
  overflow: visible;
  border-bottom: 1px solid var(--hairline);
  background: var(--cream);
  height: 320vh;
}
.gallery-sticky {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: clamp(28px, 4vh, 48px);
  padding: clamp(40px, 6vh, 72px) 0;
}
.gallery .label {
  padding: 0 var(--gutter);
  margin: 0;
  font-family: var(--mono);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--ink-quiet);
}
.gallery-track {
  display: flex;
  gap: clamp(40px, 5vw, 80px);
  padding: 0 var(--gutter);
  align-items: center;
  will-change: transform;
}
.gallery-item {
  flex: 0 0 auto;
  background: var(--cream-soft);
  position: relative;
  overflow: hidden;
}
.gallery-item picture,
.gallery-item img {
  width: 100%;
  height: 100%;
  display: block;
}
.gallery-item img {
  object-fit: cover;
  object-position: center;
}
.gallery-item.tall      { width: clamp(340px, 34vw, 500px);  aspect-ratio: 3 / 4.4; }
.gallery-item.portrait  { width: clamp(360px, 36vw, 540px);  aspect-ratio: 3 / 4; }
.gallery-item.square    { width: clamp(420px, 42vw, 620px);  aspect-ratio: 1 / 1; }
.gallery-item.landscape { width: clamp(540px, 54vw, 820px);  aspect-ratio: 16 / 10; }
.gallery-item.wide      { width: clamp(680px, 68vw, 1040px); aspect-ratio: 21 / 9; }
.gallery-item.short     { width: clamp(460px, 46vw, 700px);  aspect-ratio: 4 / 3; }
.gallery-item .cap {
  position: absolute;
  left: 16px;
  bottom: 14px;
  font-family: var(--serif);
  font-style: italic;
  font-size: 13px;
  color: rgba(244, 239, 230, 0.92);
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.4);
}

/* ============ NEARBY GUIDE ============ */
.guide {
  padding: var(--row-pad) var(--pad-x);
  border-bottom: 1px solid var(--hairline);
}
.guide-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: clamp(24px, 4vw, 56px);
  margin-bottom: clamp(48px, 6vw, 80px);
}
.guide-head-text .label {
  font-family: var(--mono);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--ink-quiet);
  margin: 0 0 14px;
}
.guide-head-text h2 {
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(26px, 3.2vw, 48px);
  line-height: 1.08;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0;
  max-width: 28ch;
  text-wrap: balance;
}
.guide-head-text h2 em { font-style: italic; }
.guide-nav {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-shrink: 0;
  padding-bottom: 4px;
}
.guide-btn {
  background: none;
  border: 1px solid var(--hairline);
  color: var(--ink);
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 15px;
  line-height: 1;
  transition: border-color 220ms ease, opacity 220ms ease;
}
.guide-btn:hover:not(:disabled) { border-color: var(--ink); }
.guide-btn:disabled { opacity: 0.22; cursor: default; }
.guide-pager {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  color: var(--ink-quiet);
  min-width: 40px;
  text-align: center;
  user-select: none;
}
.guide-track-wrap {
  border-top: 1px solid var(--hairline);
}
/* All slides stack in the same grid cell; only the active one is visible */
.guide-track {
  display: grid;
}
.guide-slide {
  grid-area: 1 / 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  opacity: 0;
  pointer-events: none;
  transition: opacity 380ms ease;
}
.guide-slide.active {
  opacity: 1;
  pointer-events: auto;
}
.guide-entry { padding: clamp(28px, 3.6vw, 52px) 0; }
.guide-entry:first-child { padding-right: clamp(28px, 4.5vw, 72px); border-right: 1px solid var(--hairline); }
.guide-entry:last-child  { padding-left:  clamp(28px, 4.5vw, 72px); }
.entry-distance {
  font-family: var(--mono);
  font-weight: 500;
  font-size: 10px;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--ink-quiet);
  margin: 0 0 12px;
}
.entry-name {
  font-family: var(--serif);
  font-weight: 300;
  font-style: italic;
  font-size: clamp(22px, 2.2vw, 32px);
  line-height: 1.15;
  letter-spacing: -0.01em;
  color: var(--ink);
  margin: 0 0 clamp(12px, 1.4vw, 18px);
}
.entry-body {
  font-family: var(--mono);
  font-weight: 400;
  font-size: 14px;
  line-height: 1.78;
  color: var(--ink);
  margin: 0;
  max-width: 48ch;
}
.entry-guide-link {
  display: inline-block;
  margin-top: clamp(16px, 1.8vw, 24px);
  font-family: var(--mono);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink-quiet);
  text-decoration: none;
  transition: color 200ms ease;
}
.entry-guide-link:hover { color: var(--ink); }

/* ============ NOTE FROM US ============ */
.note-from-us {
  padding: var(--row-pad-l) var(--pad-x);
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--col-gap);
  border-bottom: 1px solid var(--hairline);
  background: var(--cream-soft);
}
.note-from-us .label {
  grid-column: 1 / span 3;
  font-family: var(--mono);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--ink-quiet);
  margin: 6px 0 0;
}
.note-from-us .body { grid-column: 4 / -1; max-width: 68ch; }
.note-from-us .body p {
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(22px, 2.6vw, 34px);
  line-height: 1.45;
  letter-spacing: -0.005em;
  color: var(--ink);
  margin: 0 0 1.2em;
}
.note-from-us .body p em { font-style: italic; }
.note-from-us .sign {
  margin-top: clamp(28px, 4vw, 44px);
  display: flex;
  align-items: baseline;
  gap: 18px;
}
.note-from-us .sign::before {
  content: "";
  display: inline-block;
  width: 36px;
  height: 1px;
  background: var(--ink-quiet);
}
.note-from-us .sign-name {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(20px, 2.2vw, 28px);
  color: var(--ink);
}
.note-from-us .sign-who {
  font-family: var(--mono);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink-quiet);
}

/* ============ RESERVE ============ */
.reserve {
  padding: var(--row-pad-l) var(--pad-x);
}
.reserve-layout {
  display: flex;
  align-items: flex-end;
  gap: clamp(48px, 7vw, 104px);
}
.reserve-content { flex: 1; min-width: 0; }
.reserve h2 {
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(40px, 5.4vw, 84px);
  line-height: 1.04;
  letter-spacing: -0.018em;
  color: var(--ink);
  margin: 0 0 clamp(28px, 4vw, 48px);
  max-width: 18ch;
  text-wrap: balance;
}
.reserve h2 em { font-style: italic; }
.reserve p {
  font-size: 17px;
  color: var(--ink);
  max-width: 44ch;
  margin: 0 0 32px;
}
.reserve .email {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(28px, 3.6vw, 48px);
  color: var(--ink);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 6px;
  text-decoration-color: var(--hairline);
  transition: text-decoration-color 300ms ease;
}
.reserve .email:hover { text-decoration-color: var(--ink); }

/* ============ CTA BUTTON ============ */
.cta-row {
  display: flex;
  align-items: center;
  gap: 28px;
  margin-top: 36px;
  flex-wrap: wrap;
}
.book-btn {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  padding: 18px 28px;
  background: var(--ink);
  color: var(--cream);
  font-family: var(--mono);
  font-weight: 500;
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background 240ms ease;
}
.book-btn:hover { background: #2C2A28; }
.book-btn .arrow {
  width: 24px;
  height: 1px;
  background: currentColor;
  position: relative;
  transition: transform 240ms ease;
}
.book-btn .arrow::after {
  content: "";
  position: absolute;
  right: 0; top: -3px;
  width: 7px; height: 7px;
  border-right: 1px solid currentColor;
  border-top: 1px solid currentColor;
  transform: rotate(45deg);
}
.book-btn:hover .arrow { transform: translateX(4px); }
.cta-row .or {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink-quiet);
}

/* ============ FOOTER ============ */
footer {
  padding: clamp(48px, 6vw, 80px) var(--pad-x) clamp(28px, 4vw, 40px);
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: clamp(28px, 4vw, 56px);
  align-items: end;
  border-top: 1px solid var(--hairline);
}
footer .footer-mark img { width: auto; height: 26px; display: block; }
footer .links { display: flex; flex-direction: column; gap: 6px; }
footer .links a {
  color: var(--ink);
  text-decoration: none;
  font-family: var(--mono);
  font-weight: 500;
  font-size: 12px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  transition: opacity 200ms ease;
}
footer .links a:hover { opacity: 0.6; }
footer .legal {
  text-align: right;
  font-family: var(--serif);
  font-style: italic;
  font-weight: 300;
  font-size: 14px;
  color: var(--ink-quiet);
}

/* ============ RESERVE DOG ============ */
.reserve-dog {
  width: clamp(200px, 22vw, 320px);
  height: auto;
  display: block;
  mix-blend-mode: multiply;
  opacity: 0.9;
  flex-shrink: 0;
}

/* ============ SCROLL FADE-UP ============ */
.fade-up {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 1000ms cubic-bezier(0.22, 0.61, 0.36, 1),
              transform 1000ms cubic-bezier(0.22, 0.61, 0.36, 1);
}
.fade-up.in { opacity: 1; transform: translateY(0); }

/* ============ REDUCED MOTION ============ */
@media (prefers-reduced-motion: reduce) {
  .fade-up { opacity: 1; transform: none; transition: none; }
  .hero-foot, .masthead { animation: none !important; opacity: 1 !important; transform: none !important; }
  html { scroll-behavior: auto; }
}

/* ============ WIDE SCREENS - center underfilled compositions ============
   Above --content-max the reserve and note blocks are centered via
   --pad-x, but their content underfills that width and hugs the left.
   Center the content group so it sits balanced on the page. */
@media (min-width: 1601px) {
  .note-from-us {
    grid-template-columns: auto minmax(0, 68ch);
    justify-content: center;
    column-gap: clamp(40px, 5vw, 100px);
    row-gap: var(--col-gap);
  }
  .note-from-us .label { grid-column: 1; }
  .note-from-us .body  { grid-column: 2; }
  .reserve-layout      { justify-content: center; }
  .reserve-content     { flex: 0 1 auto; }
}

/* ============ SUBPAGES - guide hub & guide articles ============ */
.dek h1 {
  font-family: var(--serif);
  font-weight: 300;
  font-size: clamp(32px, 4.4vw, 64px);
  line-height: 1.1;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0;
  max-width: 28ch;
  text-wrap: balance;
}
.dek h1 em { font-style: italic; }
.dek .intro {
  font-family: var(--mono);
  font-weight: 400;
  font-size: 15px;
  line-height: 1.75;
  color: var(--ink);
  max-width: 58ch;
  margin: clamp(20px, 3vw, 32px) 0 0;
}
.crumb {
  display: inline-block;
  font-family: var(--mono);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--ink-quiet);
  text-decoration: none;
  margin-top: 6px;
  transition: color 200ms ease;
}
.crumb:hover { color: var(--ink); }

/* Text-only spread - the body takes the photo's columns */
.spread.text .body {
  grid-column: 4 / span 6;
  align-self: start;
  max-width: 62ch;
}

/* Guide hub index - one row per guide */
.guide-index { border-top: 1px solid var(--hairline); }
.guide-index-row {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--col-gap);
  align-items: start;
  padding: clamp(32px, 4.5vw, 56px) 0;
  border-bottom: 1px solid var(--hairline);
  color: var(--ink);
  text-decoration: none;
}
.guide-index-row .entry-distance { grid-column: 1 / span 2; margin: 6px 0 0; }
.guide-index-row .entry-name     { grid-column: 3 / span 3; margin: 0; }
.guide-index-row .entry-body     { grid-column: 6 / span 5; margin: 0; }
.guide-index-row .read {
  grid-column: 11 / span 2;
  justify-self: end;
  font-family: var(--mono);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--ink-quiet);
  white-space: nowrap;
  margin-top: 8px;
  transition: color 200ms ease;
}
.guide-index-row:hover .read { color: var(--ink); }
.guide-index-row:hover .entry-name { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; text-decoration-color: var(--hairline); }

/* ============ RESPONSIVE - ≤ 860px ============ */
@media (max-width: 860px) {
  .spread.text .body     { grid-column: 1 / -1; max-width: none; }
  .guide-index-row       { grid-template-columns: 1fr; gap: 12px; }
  .guide-index-row .entry-distance,
  .guide-index-row .entry-name,
  .guide-index-row .entry-body,
  .guide-index-row .read { grid-column: 1 / -1; }
  .guide-index-row .read { justify-self: start; margin-top: 4px; }
  .nav .links a          { font-size: 11px; letter-spacing: 0.16em; }
  .masthead              { font-size: 9px; }
  .dek                   { grid-template-columns: 1fr; }
  .dek > *:first-child,
  .dek > *:last-child    { grid-column: 1 / -1; }
  .guide-head               { flex-direction: column; align-items: flex-start; gap: 24px; }
  .guide-slide              { grid-template-columns: 1fr; }
  .guide-entry:first-child  { border-right: none; padding-right: 0; }
  .guide-entry:last-child   { padding-left: 0; }
  .reserve-layout        { flex-direction: column; align-items: flex-start; gap: 32px; }
  .reserve-dog           { width: clamp(130px, 35vw, 200px); }
  .note-from-us          { grid-template-columns: 1fr; gap: 24px; }
  .note-from-us .label,
  .note-from-us .body    { grid-column: 1 / -1; }
  .spread                { gap: 32px; }
  .spread .chapter       { grid-column: 1 / -1; }
  .spread .headline      { grid-column: 1 / -1; max-width: none; }
  .spread .photo,
  .spread.alt .photo     { grid-column: 1 / -1; aspect-ratio: 4 / 5; }
  .spread .body,
  .spread.alt .body      { grid-column: 1 / -1; }
  footer                 { grid-template-columns: 1fr; gap: 28px; }
  footer .legal          { text-align: left; }
  .hero-foot             { grid-template-columns: 1fr; gap: 20px; }
  .hero-foot .meta       { text-align: left; }
}