/* The Cloven Hoof: one footer for every page on clovenhoofclub.com and krampusnachtgame.com.
   Markup is written into each page by source/footer/build_footer.py; edit the template there, not the pages. */
.sf{--sf-cream:#f3e3c4;--sf-dim:#b9a88a;--sf-mute:#8f826c;--sf-red:#e2605f;--sf-line:rgba(243,227,196,.18);--sf-line-red:rgba(193,39,45,.5);
  background:#0c0a0a;border-top:1px solid var(--sf-line-red);color:var(--sf-dim);font:400 15px/1.6 "Jost",ui-sans-serif,system-ui,sans-serif;text-align:left}
.sf *{box-sizing:border-box}
.sf a{color:inherit;text-decoration:none}
.sf a:hover,.sf a:focus-visible{color:var(--sf-cream)}
.sf a:focus-visible{outline:1px solid var(--sf-cream);outline-offset:3px}
.sf-wrap{max-width:1200px;margin:0 auto;padding:0 24px}
.sf-cols{display:grid;grid-template-columns:1.3fr 1fr 1.3fr;gap:48px;padding-top:64px;padding-bottom:48px}
.sf-mark{display:inline-flex;align-items:center;gap:14px;margin-bottom:16px;color:var(--sf-cream);font:600 20px/1 "Bodoni Moda",Didot,"Times New Roman",serif;letter-spacing:.12em;text-transform:uppercase}
.sf-mark img,.sf-mark svg{height:44px;width:auto;flex:none}
.sf-mark.sf-hoof{letter-spacing:.18em}
.sf-mark.sf-hoof svg{height:30px;width:30px}
.sf p{margin:0 0 12px;max-width:36ch}
.sf .sf-indie{color:var(--sf-mute);font-size:14px}
.sf h2{margin:0 0 16px;font:500 12px/1.5 "Jost",ui-sans-serif,system-ui,sans-serif;letter-spacing:.25em;text-transform:uppercase;color:var(--sf-red)}
.sf h2 a:hover{color:var(--sf-cream)}
.sf ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.sf li [aria-current="page"]{color:var(--sf-cream)}
.sf-bottom{border-top:1px solid var(--sf-line);padding:22px 0 32px;font-size:14px;color:var(--sf-mute)}
@media (max-width:960px){.sf-cols{grid-template-columns:1fr 1fr}.sf-cols>div:first-child{grid-column:1/-1}}
@media (max-width:720px){.sf-wrap{padding:0 16px}.sf-cols{grid-template-columns:1fr;gap:32px;padding-top:48px;padding-bottom:36px}.sf-mark{font-size:15px;gap:10px}.sf-mark img{height:34px}.sf li a{display:inline-block;padding:4px 0}}
@media print{.sf{display:none}}

/* The Cloven Hoof lockup in page headers (logo rule: hoof 22px + "The Cloven Hoof", Bodoni Moda 600, 15px, .18em, capitals, cream) */
.chc-lockup{display:inline-flex;align-items:center;gap:10px;font:600 15px/1 "Bodoni Moda",Didot,"Times New Roman",serif;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;color:#f3e3c4;white-space:nowrap}
.chc-lockup .hoof{width:22px;height:22px;flex:none}
@media (max-width:520px){.chc-lockup{font-size:12px;letter-spacing:.08em;gap:7px}}
.skip-begin{display:inline-block;margin-top:6px;font:500 12px/1.4 "Jost",ui-sans-serif,system-ui,sans-serif;letter-spacing:.24em;text-transform:uppercase;color:#f3e3c4;text-decoration:none;border-bottom:1px solid rgba(193,39,45,.6);padding-bottom:3px}
