/* Shared styles for all subpages (and a few helpers used by index.html) */
html{scroll-behavior:smooth;scroll-padding-top:5rem}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;background:#f8faf7;color:#14231c}
:focus-visible{outline:3px solid #e04a2f;outline-offset:2px;border-radius:4px}

/* Playful "pop" look: thick ink borders + offset shadows */
.pop{border:2px solid #14231c;box-shadow:6px 6px 0 #14231c;border-radius:1.25rem;background:#fff}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-weight:800;border:2px solid #14231c;border-radius:.9rem;padding:.85rem 1.25rem;background:#c23a21;color:#fff;box-shadow:4px 4px 0 #14231c;transition:transform .12s,box-shadow .12s,background-color .12s;text-align:center;cursor:pointer}
.btn:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 #14231c;background:#a32f18}
.btn:active{transform:translate(4px,4px);box-shadow:0 0 0 #14231c}
.btn[disabled]{opacity:.6;cursor:wait}
.btn-alt{background:#fff;color:#14231c}
.btn-alt:hover{background:#e3ece7}
.btn-sm{padding:.5rem .9rem;font-size:.9rem;box-shadow:3px 3px 0 #14231c}
.sticker{display:inline-block;transform:rotate(-3deg);background:#f2c14e;color:#14231c;border:2px solid #14231c;font-weight:800;padding:.35rem .75rem;border-radius:.6rem;box-shadow:3px 3px 0 #14231c}
.field{width:100%;border:2px solid #14231c;border-radius:.75rem;padding:.75rem .9rem;background:#fff;font-size:1rem}
.field:focus{outline:3px solid #e04a2f;outline-offset:1px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* Scrolling town ticker (decorative, entity-rich) */
.marquee{overflow:hidden;white-space:nowrap}
.marquee>div{display:inline-block;padding-left:100%;animation:marq 42s linear infinite}
@keyframes marq{to{transform:translateX(-100%)}}

/* Native <details> FAQ */
details.faq summary{cursor:pointer;list-style:none}
details.faq summary::-webkit-details-marker{display:none}
details.faq[open] .faq-plus{transform:rotate(45deg)}
.faq-plus{transition:transform .2s}

/* Long-form copy (no typography plugin needed) */
.prose-sj{font-size:1.0625rem;line-height:1.75;color:#24342c}
.prose-sj h2{font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;font-weight:700;font-size:1.75rem;line-height:1.2;margin:2.5rem 0 .75rem;color:#14231c}
.prose-sj h3{font-weight:800;font-size:1.2rem;margin:1.75rem 0 .5rem;color:#14231c}
.prose-sj p{margin:.9rem 0}
.prose-sj ul{list-style:disc;padding-left:1.4rem;margin:.9rem 0}
.prose-sj ol{list-style:decimal;padding-left:1.4rem;margin:.9rem 0}
.prose-sj li{margin:.4rem 0}
.prose-sj a{color:#1f4a38;text-decoration:underline;font-weight:600}
.prose-sj strong{color:#14231c}

/* Mobile sticky action bar */
body.has-mbar{padding-bottom:calc(4.75rem + env(safe-area-inset-bottom,0px))}
@media(min-width:768px){body.has-mbar{padding-bottom:0}}
#mbar.is-hidden{transform:translateY(110%)}
#mbar{transition:transform .2s}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .marquee>div{animation:none;padding-left:0}
  .btn,#mbar,.faq-plus{transition:none}
}

/* Contrast: keep small gray text at 4.5:1 or better on light backgrounds */
html .text-ink\/55, html .text-ink\/60, html .text-ink\/65 { color: rgba(20,35,28,.75); }
html .text-ink\/70 { color: rgba(20,35,28,.78); }