/* SEO areas build, 31 Oct 2026. Keyword H1 styled as the eyebrow; brand line keeps the old H1 look. */
h1.eyebrow { font-size: 0.6875rem; font-weight: 400; letter-spacing: 0.14em; line-height: 1.5; text-transform: uppercase; color: var(--muted); margin-bottom: 0.85rem; max-width: none; }
.display-line { font-size: clamp(1.85rem, 5vw, 3rem); font-weight: 450; letter-spacing: -0.025em; line-height: 1.12; }
.page-hero .display-line { max-width: 22ch; }
.page-hero h1.eyebrow { max-width: none; }

.area-body { padding: 2.25rem 0 4rem; }
.area-body section + section { margin-top: 2.5rem; }
.area-body h2 { font-size: clamp(1.25rem, 3vw, 1.6rem); font-weight: 500; letter-spacing: -0.015em; line-height: 1.2; margin-bottom: 0.75rem; }
.area-body h3 { font-size: 1rem; font-weight: 550; margin-bottom: 0.35rem; }
.area-body p { color: var(--muted); max-width: 40rem; }
.area-body p + p { margin-top: 0.85rem; }
.area-body p strong { color: var(--charcoal); font-weight: 550; }
.area-body a.text-link, .area-body p a, .area-body li a { text-decoration: underline; text-underline-offset: 0.18em; text-decoration-color: var(--chrome); }
.area-body a.btn { text-decoration: none; }
.area-list { list-style: none; display: grid; gap: 0.45rem; max-width: 40rem; color: var(--muted); }
.area-list li { padding-left: 1.1rem; position: relative; }
.area-list li::before { content: ""; position: absolute; left: 0; top: 0.62em; width: 0.45rem; height: 2px; background: var(--yellow); }
.town-chips { list-style: none; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.town-chips li { background: var(--white); border: 1px solid rgba(196, 202, 210, 0.8); border-radius: 999px; padding: 0.35rem 0.85rem; font-size: 0.9rem; }
.proof-grid { list-style: none; display: grid; gap: 0.75rem; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); }
.proof-grid li a { display: block; height: 100%; background: var(--white); border: 1px solid rgba(196, 202, 210, 0.7); border-radius: 0.4rem; padding: 1rem 1.1rem; text-decoration: none; transition: border-color .2s; }
.proof-grid li a:hover { border-color: var(--charcoal); }
.proof-grid .proof-status { display: block; font-size: 0.6875rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); margin-bottom: 0.35rem; }
.proof-grid .proof-addr { display: block; font-weight: 550; }
.proof-grid .proof-meta { display: block; color: var(--muted); font-size: 0.9rem; margin-top: 0.15rem; }
.fee-box { background: var(--white); border: 1px solid rgba(196, 202, 210, 0.7); border-left: 3px solid var(--yellow); border-radius: 0.4rem; padding: 1.25rem 1.25rem; max-width: 44rem; }
.fee-box p { color: var(--charcoal); }
.fee-box p.fee-support { color: var(--muted); font-size: 0.95rem; }
.evidence-line { max-width: 44rem; font-size: 1.05rem; }
.evidence-line a { font-weight: 550; color: var(--charcoal); }
.hub-grid { display: grid; gap: 0.85rem; grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); }
.hub-card { display: block; background: var(--white); border: 1px solid rgba(196, 202, 210, 0.7); border-radius: 0.4rem; padding: 1.2rem 1.2rem; text-decoration: none !important; transition: border-color .2s; }
.hub-card:hover { border-color: var(--charcoal); }
.hub-card .hub-label { display: block; font-size: 0.6875rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); margin-bottom: 0.35rem; }
.hub-card .hub-title { display: block; font-weight: 550; font-size: 1.05rem; color: var(--charcoal); }
.hub-card .hub-towns { display: block; color: var(--muted); font-size: 0.9rem; margin-top: 0.35rem; }
.legal-copy h2 { margin-top: 2rem; }
.legal-copy ul { margin: 0.6rem 0 0 1.2rem; color: var(--muted); max-width: 40rem; }
.legal-copy ul li + li { margin-top: 0.3rem; }
.form-privacy { font-size: 0.85rem; color: var(--muted); margin-top: 0.75rem; }
.form-privacy a { text-decoration: underline; text-underline-offset: 0.18em; }
.footer-areas { order: 3; width: 100%; font-size: 0.85rem; color: var(--muted); line-height: 1.7; }
.footer-areas a { text-decoration: underline; text-underline-offset: 0.18em; text-decoration-color: var(--chrome); }
.home-areas { padding: 2.75rem 0 3.25rem; border-top: 1px solid rgba(196, 202, 210, 0.45); }
.home-areas h2 { font-size: clamp(1.25rem, 3vw, 1.6rem); font-weight: 500; letter-spacing: -0.015em; margin-bottom: 0.6rem; }
.home-areas p { color: var(--muted); max-width: 40rem; }
