:root {
    color-scheme: light;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.55;
    --ink: #19352b;
    --muted: #587066;
    --brand: #176b4c;
    --brand-dark: #0f523a;
    --surface: #ffffff;
    --soft: #edf7f1;
    --line: #d5e4dc;
    --danger: #9b2929;
}
* { box-sizing: border-box; }
body { min-height: 100vh; margin: 0; background: #f5f9f6; color: var(--ink); }
a { color: var(--brand-dark); text-underline-offset: .18em; }
a:hover, a:focus-visible { color: var(--brand); }
.site-header { background: rgba(255, 255, 255, .96); border-bottom: 1px solid var(--line); }
.header-inner, .page-shell, .footer-inner { width: min(72rem, calc(100% - 2rem)); margin-inline: auto; }
.header-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 2rem; padding: 1.15rem 0; }
.site-name { margin: 0; color: var(--ink); font-size: 1.3rem; font-weight: 800; text-decoration: none; letter-spacing: -.02em; }
.site-nav { display: flex; flex-wrap: wrap; gap: .65rem 1.35rem; }
.site-nav a { color: var(--ink); text-decoration: none; border-bottom: 2px solid transparent; }
.site-nav a:hover, .site-nav a:focus-visible, .site-nav a[aria-current="page"] { color: var(--brand-dark); border-bottom-color: var(--brand); }
.page-shell { min-height: calc(100vh - 11rem); padding: clamp(2rem, 6vw, 4.5rem) 0; }
.content-card { max-width: 54rem; padding: clamp(1.35rem, 4vw, 2.75rem); background: var(--surface); border: 1px solid var(--line); border-radius: 1rem; box-shadow: 0 .6rem 2rem rgba(25, 53, 43, .07); }
.content-card.wide { max-width: none; }
.hero { max-width: 62rem; padding: clamp(2rem, 6vw, 4rem); background: linear-gradient(135deg, #fff 25%, var(--soft)); }
.eyebrow { margin: 0 0 .5rem; color: var(--brand-dark); font-size: .82rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
h1, h2, h3 { line-height: 1.18; letter-spacing: -.02em; }
h1 { margin: 0 0 1rem; font-size: clamp(2rem, 5vw, 3.25rem); }
h2 { margin-top: 1.8rem; }
p { margin: .8rem 0; }
.lead { max-width: 44rem; color: var(--muted); font-size: 1.12rem; }
.actions, .inline-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.25rem; margin: 1.5rem 0 0; }
.primary-link, button { display: inline-block; border: 1px solid var(--brand-dark); border-radius: .55rem; background: var(--brand-dark); color: #fff; font: inherit; font-weight: 700; padding: .65rem 1rem; text-decoration: none; cursor: pointer; }
.primary-link:hover, .primary-link:focus-visible, button:hover, button:focus-visible { background: var(--brand); color: #fff; }
.category-list, .options, .ad-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: 1rem; margin: 1.5rem 0; padding: 0; list-style: none; }
.category-list li, .option, .ad { padding: 1.2rem; background: var(--surface); border: 1px solid var(--line); border-radius: .75rem; }
.category-list a { display: block; font-weight: 700; text-decoration: none; }
.option h2, .ad h2 { margin-top: 0; }
.ad { border-top: .25rem solid #83b69f; }
.ad dl { margin-bottom: 1.25rem; }
form { max-width: 46rem; }
label { display: block; margin-top: 1rem; font-weight: 650; }
input, select, textarea { display: block; width: 100%; margin-top: .3rem; padding: .7rem .75rem; border: 1px solid #aec4b9; border-radius: .45rem; background: #fff; color: var(--ink); font: inherit; }
input[type="checkbox"] { display: inline-block; width: auto; margin-right: .45rem; }
input[type="radio"] { display: inline-block; width: auto; margin-right: .3rem; }
fieldset { margin-top: 1rem; border: 1px solid var(--line); border-radius: .55rem; }
.town-sign {
    position: relative;
    isolation: isolate;
    display: grid;
    align-content: center;
    justify-items: center;
    gap: .45rem;
    width: min(23rem, calc(100% - 1rem));
    aspect-ratio: 1.48 / 1;
    margin: 2rem auto 3.5rem;
    padding: clamp(1.65rem, 6vw, 2.15rem) clamp(1.35rem, 6vw, 2.2rem);
    border: .3rem solid #a0a5a4;
    border-radius: .72rem;
    box-shadow: inset 0 0 0 .24rem #171919, 0 .2rem .42rem rgba(22, 28, 27, .16);
    background:
        radial-gradient(circle at 1.05rem 1.05rem, #6d706c 0 .16rem, #c8c9bf .18rem .3rem, transparent .32rem),
        radial-gradient(circle at calc(100% - 1.05rem) 1.05rem, #6d706c 0 .16rem, #c8c9bf .18rem .3rem, transparent .32rem),
        radial-gradient(circle at 1.05rem calc(100% - 1.05rem), #6d706c 0 .16rem, #c8c9bf .18rem .3rem, transparent .32rem),
        radial-gradient(circle at calc(100% - 1.05rem) calc(100% - 1.05rem), #6d706c 0 .16rem, #c8c9bf .18rem .3rem, transparent .32rem),
        linear-gradient(112deg, #f5d72b 0%, #ffe54a 42%, #f4d326 100%);
    color: #101111;
    text-align: center;
}
.town-sign::after {
    position: absolute;
    z-index: -1;
    top: 100%;
    left: 50%;
    width: clamp(1.65rem, 6vw, 2rem);
    height: 3.5rem;
    border-inline: .18rem solid #777d7d;
    background: linear-gradient(90deg, #858b8b, #d5d8d7 48%, #969c9b);
    content: "";
    transform: translateX(-50%);
}
.town-sign-postal-code {
    font-size: clamp(1.15rem, 4.5vw, 1.5rem);
    font-weight: 750;
    letter-spacing: .08em;
    line-height: 1.1;
}
.town-sign-place-name {
    max-width: 100%;
    overflow-wrap: anywhere;
    font-size: clamp(1.75rem, 9vw, 2.9rem);
    font-weight: 850;
    letter-spacing: -.035em;
    line-height: 1.05;
}
.local-board { display: grid; grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); gap: 1.5rem; }
button { margin-top: 1.2rem; }
dl { display: grid; grid-template-columns: minmax(9rem, 1fr) 2fr; gap: .55rem 1rem; padding: 1rem; background: var(--soft); border-radius: .65rem; }
dt { color: var(--muted); font-weight: 650; }
dd { margin: 0; font-weight: 700; }
.note, .meta { color: var(--muted); }
.error, .notice, .status { padding: .8rem 1rem; border-radius: .5rem; }
.error { background: #fff0f0; color: var(--danger); }
.notice, .status { background: var(--soft); color: var(--brand-dark); }
footer { border-top: 1px solid var(--line); color: var(--muted); }
.footer-inner { padding: 1.2rem 0; }
@media (max-width: 38rem) { dl { grid-template-columns: 1fr; } dd { margin-bottom: .45rem; } }
