/* Townline palette: sky / lake / violet with peach accent. No black-and-gold. */
:root { --sky:#1e6fd9; --sky-d:#1557b0; --lake:#22c3cf; --lake-d:#08798a; --violet:#7b5cff; --violet-d:#5a3fd6; --peach:#ffb38a; --ink:#123052; --muted:#4f6585; --line:#d6e4f5; --bg:#f3f8ff; --bad:#b42318; --warn:#a15c07; --ok:#067647; }
* { box-sizing:border-box; }
body { margin:0; font:16px/1.5 Inter, system-ui, -apple-system, "Segoe UI", sans-serif; color:var(--ink); background:var(--bg); -webkit-text-size-adjust:100%; }
.hero { position:relative; overflow:hidden; padding:2rem 1rem 2.25rem; color:#fff; background:linear-gradient(160deg, var(--sky) 0%, var(--lake-d) 55%, var(--violet) 100%); }
.hero > p, .hero > h1 { position:relative; max-width:760px; margin-left:auto; margin-right:auto; }
.hero h1 { font:700 clamp(1.7rem, 6vw, 2.6rem)/1.15 "Playfair Display", Georgia, serif; margin:.25rem auto .5rem; }
.kicker { font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; opacity:.9; margin:0 auto; }
.lead { margin:0 auto; opacity:.95; }
.hero-art { position:absolute; inset:0; pointer-events:none; }
.hero-art .sun { position:absolute; right:8%; top:14%; width:120px; height:120px; border-radius:50%; background:radial-gradient(circle, #ffe3c9 0%, var(--peach) 55%, rgba(255,179,138,0) 72%); opacity:.55; }
.hero-art .hill { position:absolute; bottom:-40px; border-radius:50% 50% 0 0; }
.hero-art .h1 { left:-10%; width:70%; height:120px; background:rgba(123,92,255,.35); }
.hero-art .h2 { right:-15%; width:75%; height:100px; background:rgba(34,195,207,.35); }
.hero-art .lake { position:absolute; left:0; right:0; bottom:0; height:22px; background:linear-gradient(90deg, rgba(255,255,255,.18), rgba(255,255,255,.05)); }
.wrap { display:grid; gap:1rem; padding:1rem; max-width:1100px; margin:-1rem auto 0; position:relative; grid-template-columns:repeat(auto-fit, minmax(min(100%, 340px), 1fr)); }
.card { background:#fff; border:1px solid var(--line); border-radius:18px; padding:1rem; box-shadow:0 6px 22px rgba(30,111,217,.08); min-width:0; }
.card h2 { margin:.1rem 0 .6rem; font-size:1.2rem; }
.card h3 { font-size:1rem; margin:1rem 0 .4rem; }
label { display:block; margin:.55rem 0; font-weight:600; font-size:.95rem; }
input, select, textarea { display:block; width:100%; margin-top:.25rem; padding:.65rem .7rem; font:inherit; font-size:16px; color:var(--ink); background:#fff; border:1px solid var(--line); border-radius:12px; }
textarea { resize:vertical; }
.two { display:grid; gap:0 .75rem; grid-template-columns:1fr 1fr; }
@media (max-width:420px) { .two { grid-template-columns:1fr; } }
button { min-height:44px; padding:.65rem 1.1rem; margin-top:.6rem; border:0; border-radius:999px; background:linear-gradient(135deg, var(--sky), var(--lake-d)); color:#fff; font:inherit; font-weight:700; cursor:pointer; }
button.ghost { background:#fff; color:var(--sky-d); border:1px solid var(--sky); }
button:disabled { opacity:.45; cursor:not-allowed; }
:focus-visible { outline:3px solid var(--violet); outline-offset:2px; }
.row { display:flex; gap:.5rem; flex-wrap:wrap; }
.hint { color:var(--muted); font-size:.88rem; margin:.4rem 0; font-weight:400; }
.proposed { display:inline-block; font-size:.7rem; letter-spacing:.06em; text-transform:uppercase; color:var(--violet-d); background:#efeaff; border-radius:999px; padding:.1rem .5rem; vertical-align:middle; font-weight:700; }
fieldset.tiers { border:1px solid var(--line); border-radius:14px; padding:.6rem .8rem; margin:.8rem 0 0; }
fieldset.tiers legend { font-weight:700; padding:0 .3rem; }
label.tier { display:flex; gap:.6rem; align-items:flex-start; padding:.55rem .6rem; border:1px solid var(--line); border-radius:12px; margin:.4rem 0; font-weight:400; }
label.tier input { width:auto; margin-top:.3rem; accent-color:var(--sky); }
label.tier em { font-style:normal; font-weight:700; color:var(--sky-d); }
label.tier small { display:block; color:var(--muted); }
label.tier:has(input:checked) { border-color:var(--sky); background:#eef5ff; }
.verdict { font-weight:700; margin:.2rem 0 .5rem; }
.verdict.good { color:var(--ok); } .verdict.bad { color:var(--bad); }
.issues, .checklist { list-style:none; padding:0; margin:0; }
.issues li { padding:.45rem .6rem; border-radius:10px; margin:.3rem 0; font-size:.93rem; }
.issues .err { background:#fef3f2; color:var(--bad); }
.issues .warn { background:#fffaeb; color:var(--warn); }
.checklist li { display:flex; gap:.5rem; padding:.35rem 0; border-bottom:1px solid var(--line); font-size:.9rem; }
.checklist li span { flex:0 0 1.4rem; height:1.4rem; border-radius:50%; text-align:center; font-weight:700; color:#fff; line-height:1.4rem; font-size:.8rem; }
.checklist .pass span { background:var(--ok); } .checklist .fail span { background:var(--bad); } .checklist .check span { background:var(--violet); }
.ev-card { position:relative; display:flex; gap:.8rem; padding:.8rem; border:1px solid var(--line); border-radius:14px; background:#fff; margin:.3rem 0 .8rem; }
.ev-card .date { flex:0 0 3.4rem; text-align:center; border-radius:12px; padding:.35rem 0; background:#eef5ff; color:var(--sky-d); }
.ev-card .date small { display:block; text-transform:uppercase; font-size:.72rem; font-weight:700; }
.ev-card .date b { font-size:1.4rem; line-height:1; }
.ev-card .body { min-width:0; }
.ev-card h3 { margin:0; font-size:1rem; overflow-wrap:anywhere; }
.ev-card h3 a { color:inherit; }
.ev-card .when { margin:.15rem 0; color:var(--muted); font-size:.88rem; }
.ev-card .desc { margin:.35rem 0; font-size:.92rem; }
.ev-card .tags { display:flex; flex-wrap:wrap; gap:.3rem; margin:.3rem 0 0; }
.ev-card .tags span:not(:empty) { font-size:.75rem; padding:.1rem .5rem; border-radius:999px; background:#e8fbfc; color:var(--lake-d); }
.ev-card.featured { border:2px solid transparent; background:linear-gradient(#fff, #fff) padding-box, linear-gradient(135deg, var(--sky), var(--lake), var(--violet)) border-box; padding-top:1.4rem; box-shadow:0 8px 24px rgba(123,92,255,.18); }
.ev-card.featured .date { background:linear-gradient(160deg, var(--sky), var(--violet)); color:#fff; }
.badge { position:absolute; top:-.6rem; left:.8rem; font-size:.7rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#fff; background:linear-gradient(135deg, var(--violet), var(--sky)); padding:.15rem .6rem; border-radius:999px; }
.quote { font-weight:600; color:var(--violet-d); }
.json { background:#f4f8fe; border:1px solid var(--line); border-radius:12px; padding:.7rem; font:13px/1.45 ui-monospace, Menlo, monospace; white-space:pre-wrap; overflow-wrap:anywhere; max-height:320px; overflow:auto; }
.price-grid { display:grid; gap:.6rem; grid-template-columns:repeat(auto-fit, minmax(140px, 1fr)); }
.price { border:1px solid var(--line); border-radius:14px; padding:.7rem; }
.price.pick { border-color:var(--violet); background:#f6f3ff; }
.price b { display:block; }
.price .amt { display:block; font-size:1.35rem; font-weight:800; color:var(--sky-d); }
.price small { color:var(--muted); }
code { font-size:.85em; background:#eef5ff; padding:0 .25rem; border-radius:4px; }
.foot { max-width:1100px; margin:0 auto; padding:.5rem 1rem 2.5rem; color:var(--muted); font-size:.85rem; text-align:center; }