/* kx-foot.css — the home's footer (round 28–30c, kx-skel.css) on every other page, 04.11. night.
   Lauro: "Footer by Product, Made for, Help perfekt" + the pages it links must all look like ours.
   The old <footer class="foot"> stays in the HTML only because site.js keys the header's menu on it; it is hidden here.
   Copied, not imported, from kx-skel.css: when one changes, change both. */
.foot { height: 0 !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; overflow: hidden !important; visibility: hidden !important; pointer-events: none }   /* folded where it stands (the page end): site.js keys the header on .foot .cols position, and still measures its wordmark */
.kx-foot3 { position: relative; margin: 0 auto; box-sizing: border-box }
.kx-foot3 { margin-top: clamp(120px, 12vw, 170px); max-width: none; padding: 0 clamp(40px, 9vw, 173px) }
.kx-foot3 .cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px }
.kx-foot3 .cols > div { display: flex; flex-direction: column; align-items: flex-start; gap: 11px }
.kx-foot3 .cols > div:nth-child(2) { align-items: center } .kx-foot3 .cols > div:nth-child(3) { align-items: flex-end }
.kx-foot3 .cols > div:nth-child(2) > *, .kx-foot3 .cols > div:nth-child(3) > * { min-width: 160px }
.kx-foot3 h2 { margin: 0 0 6px; font: 400 23px/1.1 "EB Garamond", Georgia, serif; letter-spacing: -.01em; color: rgba(21,21,21,.5) }
.kx-foot3 .cols a, .kx-f-bot a { color: #16150f; text-decoration: none; transition: color .2s } .kx-foot3 .cols a { font: 400 16px/1.3 Figtree, system-ui, sans-serif }
.kx-foot3 a:hover { color: rgba(21,21,21,.55) }
.kx-f-big { margin-top: clamp(64px, 7.8vw, 150px); color: #16150f }
.kx-f-big svg { display: block; width: 100%; height: auto; overflow: visible }
.kx-f-big .wm-mark { transition: stroke-dashoffset .12s linear }   /* the L follows the scroll (kx-skel.js drawL); "Flow" just stands */
.kx-f-bot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 28px; padding: clamp(34px, 3.3vw, 63px) 0 40px; font: 400 14px/1.4 Figtree, system-ui, sans-serif; color: rgba(21,21,21,.6) }
.kx-f-bot .lk { display: flex; gap: 22px } .kx-f-bot a { color: rgba(21,21,21,.75) }
@media (max-width: 860px) {
  .kx-foot3 { margin-top: 112px; padding: 0 16px }
  .kx-foot3 .cols { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 24px }
  .kx-foot3 .cols > div:nth-child(n) { align-items: flex-start } .kx-foot3 .cols > div:nth-child(n) > * { min-width: 0 }
  .kx-f-big { margin-top: 64px } .kx-f-bot { flex-direction: column; padding-bottom: 32px } .kx-f-bot .lk { flex-wrap: wrap; gap: 8px 18px }
}

/* Round 34, he on 04.11. night about the demo under the title (a window, one line read, the pill): "mega viele Seiten, einfach
   immer dasselbe … so lame, so unspektakulär … lieber keine Animation anstelle irgendeinen Müll … clean, minimalistisch, sehr
   simpel, dass die 6-Jahr-Leute daraus kommen." The title, the one line and the button carry the top of the page alone.
   Hidden, not deleted: t-made.js / the read pages' scripts keep their elements, and one line brings a demo back. */
.r-top :is(.xwr-demo, .xstu-demo, .xadhd-demo, .xtm-demo, .xmade-stage, .xread-stage) { display: none !important }
