/*
Theme Name:   HeiBob
Theme URI:    https://github.com/Cx3sean/heibob-site
Description:  HeiBob child theme of Twenty Twenty-Five. Layout and brand only; logic lives in HeiBob Core. Version-controlled in Git; do not edit on the server.
Author:       HeiBob
Template:     twentytwentyfive
Version:      0.2.0
Requires at least: 6.7
Requires PHP: 8.1
Text Domain:  heibob
*/
:root { --hb-blue: #4753A2; /* Profession: directory, buttons, links (7.4:1 on white) */ --hb-blue-brand: #4753A2; --hb-blue-dark: #363F80; --hb-tint: #ECEEF7; /* Article palette: backgrounds and accents only, never text on white */ --hb-health: #BCD971; --hb-cozy: #7DCBF2; --hb-warm: #F2A151; --hb-love: #EF858C; --hb-sincere: #B995C3; --hb-ink: #0F172A; --hb-muted: #475569; --hb-border: #E2E8F0; --hb-surface: #F8FAFC; --hb-star: #F2AD3D; --hb-good: #15803D; --hb-radius: 12px; --hb-shadow: 0 1px 2px rgba(15, 23, 42, .06), 0 4px 16px rgba(15, 23, 42, .06); }
body { color: var(--hb-ink); }
.hb-main { padding: 0 16px 64px; }
.hb-muted { color: var(--hb-muted); }
.hb-lead { font-size: 1.125rem; color: var(--hb-muted); max-width: 760px; }

/* ------------------------------------------------------------- header */
.hb-header { border-bottom: 1px solid var(--hb-border); background: #fff; }

/* Sticky header on desktop only; on phones screen height goes to content. */
@media (min-width: 901px) {
	header.wp-block-template-part { position: sticky; top: 0; z-index: 50; }
}
.hb-header__inner { padding: 14px 16px; align-items: center; }
.hb-logo a { color: var(--hb-ink); text-decoration: none; font-weight: 700; font-size: 1.15rem; }
.hb-logo a::before { content: ""; display: inline-block; width: 12px; height: 12px; border-radius: 3px; background: var(--hb-blue-brand); margin-right: 8px; vertical-align: middle; }

/* ------------------------------------------------------------ buttons */
.hb-btn { display: inline-block; background: var(--hb-blue); color: #fff !important; padding: 12px 20px; border-radius: 8px; font-weight: 600; text-decoration: none; border: 2px solid var(--hb-blue); line-height: 1.2; }
.hb-btn:hover { background: var(--hb-blue-dark); border-color: var(--hb-blue-dark); }
.hb-btn--ghost { background: #fff; color: var(--hb-blue) !important; }
.hb-btn--ghost:hover { background: var(--hb-tint); }
.hb-btn--small { padding: 8px 14px; font-size: .9rem; }

/* --------------------------------------------------------- breadcrumbs */
.hb-breadcrumbs ol { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; padding: 16px 0 0; margin: 0; font-size: .875rem; color: var(--hb-muted); }
.hb-breadcrumbs li + li::before { content: "›"; margin-right: 6px; color: #94A3B8; }
.hb-breadcrumbs a { color: var(--hb-muted); }

/* ----------------------------------------------------- trust elements */
.hb-stars { color: var(--hb-star); letter-spacing: 1px; }
.hb-rating strong { font-size: 1.05em; }
.hb-badges { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
.hb-badge { display: inline-block; font-size: .78rem; font-weight: 600; padding: 3px 9px; border-radius: 999px; background: var(--hb-tint); color: var(--hb-blue-dark); border: 1px solid #C9CDE6; }
.hb-badge--verified { background: #ECFDF3; color: var(--hb-good); border-color: #B7EBC6; }

/* --------------------------------------------------------- page heads */
.hb-pagehead { padding: 20px 0 8px; }
.hb-pagehead h1 { margin: 0 0 8px; }
.hb-section { padding: 28px 0; border-top: 1px solid var(--hb-border); }
.hb-section > h2 { margin-top: 0; }

/* --------------------------------------------------------- card grids */
.hb-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 16px; }
.hb-card { background: #fff; border: 1px solid var(--hb-border); border-radius: var(--hb-radius); overflow: hidden; transition: box-shadow .15s, transform .15s; }
.hb-card:hover { box-shadow: var(--hb-shadow); transform: translateY(-2px); }
.hb-card__link { color: inherit; text-decoration: none; display: block; }
.hb-card__img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; display: block; background: var(--hb-surface); }
.hb-card__img--empty { aspect-ratio: 4 / 3; background: var(--hb-surface); }
.hb-card__body { padding: 12px 14px 14px; }
.hb-card__title { font-size: 1rem; margin: 0 0 4px; line-height: 1.35; }

/* ------------------------------------------------------- listing tabs */
.hb-tabs { display: flex; gap: 4px; overflow-x: auto; position: sticky; top: var(--hb-header-h, 72px); background: #fff; z-index: 10; border-bottom: 1px solid var(--hb-border); margin: 8px 0 0; }
.hb-tabs a { padding: 12px 14px; white-space: nowrap; color: var(--hb-muted); text-decoration: none; font-weight: 600; border-bottom: 2px solid transparent; }
.hb-tabs a:hover { color: var(--hb-blue); border-bottom-color: var(--hb-blue-brand); }

/* -------------------------------------------------------------- reviews */
.hb-review { padding: 16px 0; border-bottom: 1px solid var(--hb-border); }
.hb-review__head { display: flex; gap: 8px; align-items: center; }
.hb-review__body p { margin: 0 0 8px; }
.hb-faq { border-bottom: 1px solid var(--hb-border); padding: 12px 0; }
.hb-faq summary { font-weight: 600; cursor: pointer; }
.hb-faq p { margin: 8px 0 0; color: var(--hb-muted); }

/* ---------------------------------------------------------- pagination */
.hb-pagination { margin: 24px 0; display: flex; gap: 6px; flex-wrap: wrap; }
.hb-pagination .page-numbers { padding: 8px 12px; border: 1px solid var(--hb-border); border-radius: 8px; text-decoration: none; }
.hb-pagination .current { background: var(--hb-blue); color: #fff; border-color: var(--hb-blue); }

/* -------------------------------------------------------------- footer */
.hb-footer { background: var(--hb-ink); color: #CBD5E1; padding: 40px 16px 24px; margin-top: 48px; }
.hb-footer a { color: #fff; }
.hb-footer__grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 24px; }
@media (max-width: 800px) {
	.hb-footer__grid { grid-template-columns: 1fr 1fr; }
	.hb-footer__brand { grid-column: 1 / -1; }
}
.hb-footer h3 { color: #fff; font-size: 1rem; margin: 0 0 10px; }
.hb-footer ul { list-style: none; padding: 0; margin: 0; }
.hb-footer li { margin: 6px 0; }
.hb-footer__name { color: #fff; font-weight: 700; font-size: 1.1rem; margin: 0 0 8px; }
.hb-footer__legal { border-top: 1px solid #334155; margin-top: 28px; padding-top: 16px; font-size: .82rem; }
.screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; }
html { scroll-padding-top: 120px; }
img { max-width: 100%; }

/* ---------------------------------------------------------------- menu */
.hb-header__inner { position: relative; flex-wrap: nowrap !important; }
.hb-nav__list { list-style: none; margin: 0; padding: 0; }
.hb-nav__burger { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin-right: -10px; border: 0; background: none; cursor: pointer; }
.hb-nav__bars, .hb-nav__bars::before, .hb-nav__bars::after { display: block; width: 22px; height: 2px; background: var(--hb-ink); border-radius: 2px; position: relative; transition: transform .2s, background .2s; }
.hb-nav__bars::before, .hb-nav__bars::after { content: ""; position: absolute; left: 0; }
.hb-nav__bars::before { top: -7px; }
.hb-nav__bars::after { top: 7px; }
.hb-nav.is-open .hb-nav__bars { background: transparent; }
.hb-nav.is-open .hb-nav__bars::before { transform: translateY(7px) rotate(45deg); }
.hb-nav.is-open .hb-nav__bars::after { transform: translateY(-7px) rotate(-45deg); }
.hb-menu__title { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--hb-muted); margin: 0 0 6px; }
.hb-menu ul { list-style: none; margin: 0; padding: 0; }
.hb-menu a { display: block; padding: 8px 0; color: var(--hb-ink); text-decoration: none; }
.hb-menu a:hover { color: var(--hb-blue); }
.hb-nav__top { color: var(--hb-ink); text-decoration: none; font-weight: 600; }
.hb-nav button:focus:not(:focus-visible) { outline: none; }

/* Phones and tablets: full-height panel with accordions. */
@media (max-width: 960px) {
	.hb-nav__panel { display: none; position: fixed; left: 0; right: 0; top: var(--hb-panel-top, 64px); bottom: 0; background: #fff; overflow-y: auto; padding: 8px 16px 32px; border-top: 1px solid var(--hb-border); z-index: 60; }
	.hb-nav.is-open .hb-nav__panel { display: block; }
	html.hb-nav-open, html.hb-nav-open body { overflow: hidden; }
	.hb-nav__item { display: grid; grid-template-columns: 1fr 48px; align-items: center; border-bottom: 1px solid var(--hb-border); }
	.hb-nav__top { padding: 16px 0; font-size: 1.1rem; }
	.hb-nav__toggle { width: 48px; height: 48px; border: 0; background: none; cursor: pointer; position: relative; }
	.hb-nav__toggle::after { content: ""; position: absolute; left: 50%; top: 50%; width: 9px; height: 9px; border-right: 2px solid var(--hb-muted); border-bottom: 2px solid var(--hb-muted); transform: translate(-50%, -70%) rotate(45deg); transition: transform .2s; }
	.hb-nav__item.is-open .hb-nav__toggle::after { transform: translate(-50%, -30%) rotate(-135deg); }
	.hb-menu { display: none; grid-column: 1 / -1; padding: 0 0 12px; }
	.hb-nav__item.is-open .hb-menu { display: block; }
	.hb-menu__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; }
	.hb-nav__cta { padding-top: 20px; }
	.hb-nav__cta .hb-btn { display: block; text-align: center; padding: 14px; font-size: 1rem; }
}

/* Desktop: inline menu with dropdown panels. */
@media (min-width: 961px) {
	.hb-nav__burger { display: none; }
	.hb-nav__list { display: flex; align-items: center; gap: 4px; }
	.hb-nav__item { position: relative; display: flex; align-items: center; }
	.hb-nav__top { padding: 10px 4px 10px 12px; }
	.hb-nav__toggle { width: 24px; height: 36px; border: 0; background: none; cursor: pointer; position: relative; margin-right: 6px; }
	.hb-nav__toggle::after { content: ""; position: absolute; left: 50%; top: 50%; width: 6px; height: 6px; border-right: 2px solid var(--hb-muted); border-bottom: 2px solid var(--hb-muted); transform: translate(-50%, -70%) rotate(45deg); }
	.hb-menu { display: none; position: absolute; top: 100%; left: 0; min-width: 440px; background: #fff; border: 1px solid var(--hb-border); border-radius: var(--hb-radius); box-shadow: 0 12px 32px rgba(15, 23, 42, .14); padding: 18px 20px 14px; z-index: 70; }
	.hb-nav__item:last-of-type .hb-menu, .hb-nav__item:nth-last-child(2) .hb-menu { left: auto; right: 0; }
	.hb-nav__item.is-open .hb-menu { display: block; }
	.hb-nav__item.is-open .hb-nav__top { color: var(--hb-blue); }
	.hb-menu__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 0 28px; }
	.hb-menu a { padding: 5px 0; font-size: .95rem; }
	.hb-nav__cta { margin-left: 12px; }
}

/* ------------------------------------------------------- shared bits */
.hb-section__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.hb-section__head h2 { margin: 0; }
.hb-section__head > a { white-space: nowrap; font-weight: 600; text-decoration: none; }
.hb-chips { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.hb-chips li { padding: 6px 12px; border-radius: 999px; background: var(--hb-surface); border: 1px solid var(--hb-border); font-size: .9rem; }

.hb-card__media { position: relative; }

/* Horizontal scrollers on phones: one and a bit cards visible. */
@media (max-width: 700px) {
	.hb-grid--scroll { display: grid; grid-auto-flow: column; grid-auto-columns: 78%; grid-template-columns: none; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: 16px; gap: 12px; margin: 0 -16px; padding: 0 16px 8px; scrollbar-width: none; align-items: start; }
	.hb-grid--scroll::-webkit-scrollbar { display: none; }
	.hb-grid--scroll > * { scroll-snap-align: start; }
	.hb-card:hover { transform: none; }
}

/* ----------------------------------------------------------- reviews */
.hb-review__body.is-clamped { display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }

/* ------------------------------------------------------------ homepage */
.hb-hero { display: grid; gap: 24px; padding: 20px 0 28px; }
@media (min-width: 901px) {
	.hb-hero { max-width: 760px; padding: 40px 0; }
}
.hb-hero h1 { font-size: clamp(2rem, 1.4rem + 2.4vw, 3.1rem); line-height: 1.08; margin: 0 0 12px; letter-spacing: -.01em; }
.hb-hero .hb-lead { margin: 0 0 20px; }
.hb-search { display: grid; gap: 10px; background: #fff; border: 1px solid var(--hb-border); border-radius: 14px; padding: 12px; box-shadow: var(--hb-shadow); }
@media (min-width: 601px) {
	.hb-search { grid-template-columns: 1fr 1fr auto; align-items: end; }
}
.hb-search label { display: grid; gap: 4px; font-size: .78rem; font-weight: 700; color: var(--hb-muted); text-transform: uppercase; letter-spacing: .05em; }
.hb-search select { font: inherit; font-size: 1rem; text-transform: none; letter-spacing: 0; color: var(--hb-ink); padding: 11px 12px; border: 1px solid var(--hb-border); border-radius: 8px; background: var(--hb-surface); min-height: 46px; }
.hb-search .hb-btn { min-height: 46px; }

/* ------------------------------------------------- mobile type and spacing */
@media (max-width: 700px) {
	.hb-section { padding: 22px 0; }
	.hb-pagehead { padding-top: 12px; }
	.hb-lead { font-size: 1.02rem; }
	.hb-breadcrumbs ol { padding-top: 12px; font-size: .82rem; }
}

/* ----------------------------------------------------------- directory */
.hb-pagehead--compact { padding-bottom: 4px; }
.hb-pagehead--compact h1 { margin-bottom: 6px; }
@media (max-width: 700px) {
	.hb-pagehead--compact h1 { font-size: 1.6rem; }
	.hb-pagehead--compact .hb-lead { font-size: .95rem; margin: 0; }
}
.hb-toolbar__count { margin: 8px 0 0; color: var(--hb-muted); font-size: .9rem; }
.hb-quick { list-style: none; margin: 0; padding: 2px 0; display: flex; gap: 6px; overflow-x: auto; min-width: 0; flex: 1 1 auto; scrollbar-width: none; }
.hb-quick::-webkit-scrollbar { display: none; }
.hb-quick a { display: inline-flex; align-items: center; min-height: 40px; white-space: nowrap; padding: 0 14px; border-radius: 999px; border: 1px solid var(--hb-border); color: var(--hb-ink); text-decoration: none; font-size: .92rem; background: #fff; }
.hb-quick a.is-active { background: var(--hb-blue); border-color: var(--hb-blue); color: #fff; }

/* Inline prompts and empty states. */
.hb-inline-cta { display: grid; gap: 12px; padding: 18px; border-radius: var(--hb-radius); background: var(--hb-tint); border: 1px solid #C9CDE6; }
.hb-inline-cta__title { font-weight: 700; font-size: 1.1rem; margin: 0 0 4px; }
.hb-inline-cta p { margin: 0; }
.hb-inline-cta .hb-btn { text-align: center; }
@media (min-width: 701px) {
	.hb-inline-cta { grid-template-columns: 1fr auto; align-items: center; padding: 20px 24px; }
}
.hb-empty { padding: 24px; border: 1px dashed #CBD5E1; border-radius: var(--hb-radius); text-align: center; }
.hb-pagination .page-numbers { min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }

/* Phones: header is not sticky, so tabs stick to the top. */
@media (max-width: 900px) {
	.hb-tabs { top: 0; }
	html { scroll-padding-top: 70px; }
}

/* Listing cards: photo on top on phones, photo left from 700px. */
.hb-listgrid { display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr); margin: 12px 0 8px; }
.hb-listgrid > .hb-inline-cta { grid-column: 1 / -1; }
.hb-listgrid--scroll { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(260px, 82%); overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 6px; }
.hb-listgrid--scroll > * { scroll-snap-align: start; }
.hb-listcard { display: grid; grid-template-columns: minmax(0, 1fr); background: #fff; border: 1px solid var(--hb-border); border-radius: var(--hb-radius); overflow: hidden; }
.hb-listcard--featured { border-color: var(--hb-blue-brand); box-shadow: 0 0 0 2px var(--hb-tint); }
.hb-listcard__media { display: block; background: var(--hb-surface); }
.hb-listcard__media .hb-card__img { aspect-ratio: 16 / 9; }
.hb-listcard__body { padding: 12px 14px 14px; display: grid; gap: 6px; align-content: start; }
.hb-listcard__flag { margin: 0; font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--hb-blue); }
.hb-listcard__name { margin: 0; font-size: 1.08rem; line-height: 1.3; }
.hb-listcard__name a { color: var(--hb-ink); text-decoration: none; }
.hb-listcard__name a:hover { color: var(--hb-blue); }
.hb-listcard__rating, .hb-listcard__meta { margin: 0; font-size: .92rem; }
.hb-listcard__meta { color: var(--hb-muted); }
.hb-listcard .hb-badges { margin: 2px 0; }
@media (min-width: 700px) {
	.hb-listgrid:not(.hb-listgrid--scroll) .hb-listcard { grid-template-columns: 220px minmax(0, 1fr); }
	.hb-listgrid:not(.hb-listgrid--scroll) .hb-listcard__media .hb-card__img { height: 100%; aspect-ratio: auto; min-height: 170px; }
	.hb-listgrid--scroll { grid-auto-columns: 300px; }
}
.hb-listhead { margin: 28px 0 4px; }
.hb-badge--plain { background: var(--hb-surface); color: var(--hb-muted); border-color: var(--hb-border); }

/* Call / Directions / Website: big enough to hit with a thumb. */
.hb-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.hb-actions .hb-btn { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; }
.hb-actions .hb-btn--small { min-height: 40px; }
.hb-listing__head .hb-actions .hb-btn { flex: 1 1 0; }

/* City, service and nearby links. */
.hb-linkgrid { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.hb-linkgrid a { display: flex; justify-content: space-between; align-items: center; gap: 8px; min-height: 44px; padding: 8px 14px; border: 1px solid var(--hb-border); border-radius: 10px; color: var(--hb-ink); text-decoration: none; background: #fff; }
.hb-linkgrid a:hover { border-color: var(--hb-blue-brand); color: var(--hb-blue); }

/* Listing page. */
.hb-listing { max-width: 760px; }
.hb-listing__head { padding: 16px 0 8px; }
.hb-listing__head h1 { margin: 12px 0 4px; }
.hb-listing__photo { margin: 0 -16px; }
.hb-listing__img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.hb-listing__sub { margin: 0 0 8px; color: var(--hb-muted); }
@media (min-width: 760px) {
	.hb-listing__photo { margin: 0; border-radius: var(--hb-radius); overflow: hidden; }
}
.hb-hours { border-collapse: collapse; width: 100%; max-width: 420px; }
.hb-hours th, .hb-hours td { text-align: left; padding: 6px 0; border-bottom: 1px solid var(--hb-border); font-weight: 400; }
.hb-hours th { color: var(--hb-muted); width: 45%; }
.hb-map { width: 100%; aspect-ratio: 4 / 3; border: 0; border-radius: var(--hb-radius); background: var(--hb-surface); }
@media (min-width: 700px) {
	.hb-map { aspect-ratio: 16 / 9; }
}
.hb-review__reply { margin: 8px 0 0 12px; padding: 8px 12px; border-left: 3px solid var(--hb-blue-brand); background: var(--hb-surface); border-radius: 0 8px 8px 0; }

/* Sticky Call / Website bar on phones only. */
.hb-sticky-bar { display: none; }
@media (max-width: 760px) {
	.hb-sticky-bar { display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; background: #fff; border-top: 1px solid var(--hb-border); padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); box-shadow: 0 -4px 16px rgba(15, 23, 42, .08); }
	.hb-sticky-bar .hb-actions { margin: 0; flex-wrap: nowrap; }
	.hb-sticky-bar .hb-btn { flex: 1 1 0; }
	.hb-listing { padding-bottom: 72px; }
}

/* FAQ and guide card. */
.hb-faq__item { border-bottom: 1px solid var(--hb-border); padding: 12px 0; }
.hb-faq__item summary { font-weight: 600; cursor: pointer; min-height: 28px; }
.hb-faq__item p { margin: 8px 0 0; color: var(--hb-muted); }
.hb-pillarcard { margin: 24px 0; padding: 16px; border: 1px solid var(--hb-border); border-radius: var(--hb-radius); background: var(--hb-tint); }
.hb-pillarcard p { margin: 0 0 4px; }
.hb-pillarcard__label { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--hb-blue); }

/* Free listings: contact details hidden, say why in one line. */
.hb-locked { margin: 8px 0 0; font-size: .875rem; color: var(--hb-muted, #64748b); }
.hb-locked a { color: var(--hb-blue); text-decoration: underline; }

/* Vet clinic facts and vet pages */
.hb-er { margin: 16px 0 0; padding: 14px 16px; border-radius: var(--hb-radius); background: #FFF4E8; border-left: 4px solid var(--hb-warm); }
.hb-er--open { background: #F3F8E6; border-left-color: var(--hb-health); }
.hb-facts { width: 100%; border-collapse: collapse; }
.hb-facts th, .hb-facts td { text-align: left; vertical-align: top; padding: 10px 12px 10px 0; border-bottom: 1px solid var(--hb-border); }
.hb-facts th { width: 30%; color: var(--hb-muted); font-weight: 600; }
.hb-pricelist { padding-left: 1.1em; }
.hb-offer { padding: 10px 14px; border-radius: 8px; background: #EAF7FD; border-left: 4px solid var(--hb-cozy); }
.hb-team { list-style: none; padding: 0; display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.hb-team__vet { display: flex; gap: 12px; align-items: flex-start; }
.hb-team__img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; flex: none; }
.hb-team__img--empty { display: grid; place-items: center; background: var(--hb-tint); color: var(--hb-blue); font-weight: 700; }
.hb-empty { padding: 18px; border: 1px dashed var(--hb-border); border-radius: var(--hb-radius); color: var(--hb-muted); }
.hb-checked { margin-top: 24px; font-size: .875rem; color: var(--hb-muted); }
.hb-vet__head { padding: 24px 0 8px; }
.hb-vet__img { width: 140px; height: 140px; border-radius: 50%; object-fit: cover; }
.hb-vet__cred { font-weight: 500; color: var(--hb-muted); }
.hb-links { padding-left: 1.1em; }
@media (max-width: 600px) { .hb-facts th { width: 40%; } }

/* Directory upgrade: monogram tiles, today's hours, collections, map */
.hb-mono { display: grid; place-items: center; aspect-ratio: 16 / 9; width: 100%; background: linear-gradient(135deg, #ECEEF7, #DDE1F1); color: var(--hb-blue); font-weight: 700; font-size: 2rem; letter-spacing: .04em; }
.hb-listcard__status { margin: 0; font-size: .9rem; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.hb-open { font-weight: 600; }
.hb-open--yes { color: var(--hb-good); }
.hb-open--no { color: var(--hb-muted); }
.hb-listcard__sum { margin: 0; font-size: .92rem; color: var(--hb-muted); }
.hb-chips--small { gap: 6px; }
.hb-chips--small li { padding: 3px 9px; font-size: .78rem; background: var(--hb-tint); border-color: #C9CDE6; color: var(--hb-blue-dark); }
.hb-quick--colls { flex-wrap: wrap; overflow: visible; margin: 4px 0 12px; }
.hb-quick--colls a span { margin-left: 6px; font-size: .8rem; opacity: .7; }
.hb-morefilters { margin: 8px 0 12px; }
.hb-morefilters summary { cursor: pointer; font-weight: 600; color: var(--hb-blue); padding: 6px 0; }
.hb-morefilters .hb-quick { flex-wrap: wrap; overflow: visible; margin-top: 8px; }
.hb-mapbox { margin: 12px 0; border: 1px solid var(--hb-border); border-radius: var(--hb-radius); background: #fff; }
.hb-mapbox summary { cursor: pointer; padding: 12px 16px; font-weight: 600; color: var(--hb-blue); }
.hb-citymap { height: 420px; border-top: 1px solid var(--hb-border); border-radius: 0 0 var(--hb-radius) var(--hb-radius); }
@media (max-width: 600px) { .hb-citymap { height: 320px; } .hb-mono { font-size: 1.6rem; } }
@media (min-width: 701px) { .hb-listgrid:not(.hb-listgrid--scroll) .hb-listcard .hb-mono { aspect-ratio: auto; height: 100%; min-height: 160px; } }

/* Forms, dashboard, plans, gallery */
.hb-form { display: grid; gap: 16px; max-width: 640px; margin: 16px 0 24px; }
.hb-field { display: grid; gap: 6px; }
.hb-field label, .hb-hoursedit legend, .hb-stars-in legend { font-weight: 600; }
.hb-field__help { font-size: .88rem; color: var(--hb-muted); }
.hb-field input, .hb-field select, .hb-field textarea, .hb-hoursedit input { font: inherit; width: 100%; box-sizing: border-box; padding: 11px 12px; border: 1px solid #CBD5E1; border-radius: 8px; background: #fff; color: var(--hb-ink); min-height: 44px; }
.hb-field input:focus, .hb-field select:focus, .hb-field textarea:focus, .hb-hoursedit input:focus { outline: 3px solid #C9CDE6; border-color: var(--hb-blue); }
.hb-check { display: flex; gap: 10px; align-items: flex-start; font-size: .95rem; }
.hb-check input { margin-top: 4px; width: 18px; height: 18px; flex: none; }
.hb-form .hb-btn { justify-self: start; cursor: pointer; font: inherit; font-weight: 600; }
.hb-form__about { margin: 0; padding: 10px 14px; background: var(--hb-tint); border-radius: 8px; }
.hb-form__small { font-size: .9rem; color: var(--hb-muted); margin: 0; }
.hb-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.hb-notice { margin: 16px 0; padding: 14px 16px; border-radius: 8px; background: #ECFDF3; border-left: 4px solid var(--hb-good); }
.hb-notice--error { background: #FEF2F2; border-left-color: #B91C1C; }
.hb-steps-plain { padding-left: 1.2em; color: var(--hb-muted); }
.hb-hoursedit { border: 1px solid var(--hb-border); border-radius: 8px; padding: 12px 14px; display: grid; gap: 8px; }
.hb-hoursedit label { display: grid; grid-template-columns: 48px 1fr; align-items: center; gap: 8px; font-weight: 600; }
.hb-stars-in { border: 0; padding: 0; margin: 0; display: flex; flex-direction: row-reverse; justify-content: flex-end; gap: 4px; }
.hb-stars-in legend { width: 100%; margin-bottom: 4px; }
.hb-stars-in input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.hb-stars-in label { font-size: 2rem; line-height: 1; color: #CBD5E1; cursor: pointer; padding: 2px; }
.hb-stars-in input:checked ~ label, .hb-stars-in label:hover, .hb-stars-in label:hover ~ label { color: var(--hb-star); }
.hb-stars-in input:focus-visible + label { outline: 3px solid #C9CDE6; border-radius: 4px; }
.hb-dash-head h2 { margin-bottom: 4px; }
.hb-meter { height: 10px; background: var(--hb-surface); border: 1px solid var(--hb-border); border-radius: 999px; overflow: hidden; max-width: 480px; }
.hb-meter span { display: block; height: 100%; background: var(--hb-health); }
.hb-checklist { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 16px; color: var(--hb-muted); }
.hb-checklist .is-done { color: var(--hb-good); }
.hb-leads { list-style: none; padding: 0; display: grid; gap: 12px; }
.hb-leads li { padding: 12px 14px; border: 1px solid var(--hb-border); border-radius: 8px; }
.hb-guide { background: #F3F8E6; border-left: 4px solid var(--hb-health); padding: 12px 16px; border-radius: 8px; }
.hb-guide ul { margin: 6px 0 0; padding-left: 1.1em; }
.hb-dash-photos, .hb-gallery { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.hb-dash-photos li { display: grid; gap: 4px; font-size: .85rem; }
.hb-dash-photos img, .hb-gallery img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px; display: block; }
.hb-gallery figure { margin: 0; }
.hb-gallery figcaption { font-size: .85rem; color: var(--hb-muted); margin-top: 4px; }
.hb-plans { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.hb-plan { border: 1px solid var(--hb-border); border-radius: var(--hb-radius); padding: 18px; background: #fff; }
.hb-plan--plus { border-color: var(--hb-warm); box-shadow: 0 0 0 2px #FDE7D1; }
.hb-plan h3 { margin: 0 0 6px; }
.hb-plan__price { margin: 0 0 10px; }
.hb-plan ul { padding-left: 1.1em; margin: 0 0 14px; }

/* Articles (Health / Cozy / Warm families) */
.hb-art-head { padding: 20px 0 8px; }
.hb-art-kicker { margin: 0 0 6px; font-size: .82rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #5B7A1F; }
.hb-art-head--post .hb-art-kicker, .hb-art-head--hb_glossary .hb-art-kicker { color: #1D6E96; }
.hb-art-head--hb_pick .hb-art-kicker { color: #A3510C; }
.hb-art-head h1 { margin: 0 0 10px; line-height: 1.15; }
.hb-art-byline { margin: 0 0 16px; font-size: .92rem; color: var(--hb-muted); }
.hb-verified { color: var(--hb-good); font-weight: 600; }
.hb-takeaways { background: #F3F8E6; border-left: 4px solid var(--hb-health); border-radius: 8px; padding: 14px 18px; margin: 8px 0 20px; }
.hb-art-head--post .hb-takeaways, .hb-art-head--hb_glossary .hb-takeaways { background: #EAF7FD; border-left-color: var(--hb-cozy); }
.hb-takeaways h2 { font-size: 1.05rem; margin: 0 0 6px; }
.hb-takeaways ul { margin: 0; padding-left: 1.1em; }
.hb-article .wp-block-post-content h2 { margin-top: 2em; }
.hb-article .wp-block-post-content h3 { margin-top: 1.5em; }
.hb-article .wp-block-post-content table { border-collapse: collapse; width: 100%; font-size: .95rem; }
.hb-article .wp-block-post-content th, .hb-article .wp-block-post-content td { border-bottom: 1px solid var(--hb-border); padding: 8px 10px 8px 0; text-align: left; vertical-align: top; }
.hb-er h2 { margin: 0 0 6px; font-size: 1.1rem; }
.hb-er ul { margin: 6px 0 0; padding-left: 1.1em; }
.hb-bridge { margin: 28px 0; padding: 18px; border-radius: var(--hb-radius); background: var(--hb-tint); border: 1px solid #C9CDE6; }
.hb-bridge h2 { margin: 0 0 6px; color: var(--hb-blue-dark); }
.hb-refs ol { font-size: .9rem; color: var(--hb-muted); padding-left: 1.2em; }
.hb-disclosure { font-size: .88rem; background: #FFF4E8; border-radius: 8px; padding: 8px 12px; margin: 0 0 16px; }
.hb-btn--warm { background: #C2410C; border-color: #C2410C; }
.hb-btn--warm:hover { background: #9A3412; border-color: #9A3412; }
.hb-inline-cta--warm { border-color: var(--hb-warm); background: #FFF4E8; }
.hb-picks ol { list-style: none; padding: 0; display: grid; gap: 14px; }
.hb-picks--top ol { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.hb-pick { border: 1px solid var(--hb-border); border-radius: var(--hb-radius); padding: 16px; background: #fff; display: grid; gap: 6px; align-content: start; }
.hb-pick__for { margin: 0; font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: #A3510C; }
.hb-pick h3 { margin: 0; font-size: 1.05rem; }
.hb-pick p { margin: 0; }
.hb-pick .hb-btn { justify-self: start; margin-top: 6px; }
.hb-systiles { list-style: none; padding: 0; display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.hb-systiles a { display: grid; gap: 4px; height: 100%; box-sizing: border-box; padding: 14px 16px; border: 1px solid var(--hb-border); border-top: 4px solid var(--hb-health); border-radius: var(--hb-radius); text-decoration: none; color: var(--hb-ink); background: #fff; }
.hb-systiles a:hover { box-shadow: var(--hb-shadow); }
.hb-systiles span { font-size: .9rem; color: var(--hb-muted); }
.hb-systiles em { font-style: normal; font-size: .82rem; color: #5B7A1F; font-weight: 600; }
.hb-artlist { list-style: none; padding: 0; display: grid; gap: 14px; }
.hb-artlist li { display: grid; gap: 2px; padding-bottom: 12px; border-bottom: 1px solid var(--hb-border); }
.hb-artlist a { font-weight: 600; font-size: 1.05rem; }
.hb-artlist span { color: var(--hb-muted); font-size: .93rem; }
.hb-artlist em { font-style: normal; font-size: .82rem; }
.hb-az { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; position: sticky; top: var(--hb-header-h, 72px); background: #fff; padding: 8px 0; z-index: 5; }
.hb-az a { min-width: 36px; min-height: 36px; display: grid; place-items: center; border: 1px solid var(--hb-border); border-radius: 8px; text-decoration: none; font-weight: 600; }

/* ================================================================
   Design v2 — Sean's mock "HeiBob v2: Health, Cozy, Warm"
   Profession indigo: links, logo tiles, active chips, footer.
   Warm orange: primary actions only. Cozy / Warm / Health tints: sections.
   ================================================================ */
:root {
	--hb2-ink: #1D2640; --hb2-muted: #4B5470; --hb2-line: #E3E7F0; --hb2-surface: #F7F8FB;
	--hb2-prof: #4753A2; --hb2-prof-dark: #262D5E; --hb2-prof-tint: #ECEEF7;
	--hb2-warm: #F2A151; --hb2-warm-hover: #E98F38; --hb2-warm-tint: #FDEFE2;
	--hb2-cozy-tint: #E7F3FC; --hb2-health-tint: #F1F7E3; --hb2-health-ink: #4D6B12;
	--hb2-love-tint: #FDE9EA; --hb2-love-ink: #B4434C; --hb2-sincere-tint: #F3ECF6; --hb2-sincere-ink: #7A4C88;
	--hb2-display: "Nunito", "Trebuchet MS", system-ui, sans-serif;
	--hb2-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
	--hb2-r: 14px;
	--hb-blue: var(--hb2-prof);
}
body, .wp-site-blocks { font-family: var(--hb2-body); color: var(--hb2-ink); }
h1, h2, h3, h4, .wp-block-post-title, .hb2-logo span { font-family: var(--hb2-display); color: var(--hb2-ink); text-wrap: balance; }
h1 { font-weight: 900; letter-spacing: -.01em; }
h2, h3 { font-weight: 800; }
a { color: var(--hb2-prof); }

/* Header */
.hb-header { border-bottom: 1px solid var(--hb2-line); background: #fff; position: relative; z-index: 20; }
.hb-header__inner { align-items: center; padding-block: 14px; }
.hb2-logo { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--hb2-ink); font-size: 1.35rem; font-weight: 900; }
.hb2-logo__mark { width: 32px; height: 32px; border-radius: 9px; background: var(--hb2-warm); color: var(--hb2-ink); display: grid; place-items: center; }
.hb2-logo--light { color: #fff; }
.hb2-nav__list { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 4px 22px; flex-wrap: wrap; }
.hb2-nav__list a { color: var(--hb2-ink); text-decoration: none; font-weight: 500; font-size: 1rem; }
.hb2-nav__list a:hover, .hb2-nav__list a[aria-current] { color: var(--hb2-prof); }
.hb2-nav__cta { display: inline-block; padding: 9px 16px; border: 2px solid var(--hb2-ink); border-radius: 10px; font-weight: 600 !important; }
.hb2-nav__cta:hover { border-color: var(--hb2-prof); }
.hb2-nav__toggle, .hb2-nav__burger { display: none; }
@media (max-width: 760px) {
	.hb2-nav__burger { display: inline-grid; place-items: center; width: 44px; height: 44px; cursor: pointer; }
	.hb2-nav__burger span:first-child, .hb2-nav__burger span:first-child::before, .hb2-nav__burger span:first-child::after { display: block; width: 22px; height: 2px; background: var(--hb2-ink); border-radius: 2px; position: relative; content: ""; }
	.hb2-nav__burger span:first-child::before { position: absolute; top: -7px; }
	.hb2-nav__burger span:first-child::after { position: absolute; top: 7px; }
	.hb2-nav__list { display: none; position: absolute; left: 0; right: 0; top: 100%; background: #fff; border-bottom: 1px solid var(--hb2-line); flex-direction: column; align-items: stretch; gap: 0; padding: 8px max(16px, env(safe-area-inset-left, 0px)) 16px; }
	.hb2-nav__list li a { display: block; padding: 12px 0; }
	.hb2-nav__cta { text-align: center; margin-top: 8px; }
	.hb2-nav__toggle:checked ~ .hb2-nav__list { display: flex; }
}

/* Shared */
.hb2-wrap { max-width: 1180px; margin-inline: auto; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
.hb2-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 0 22px; border-radius: 10px; font-weight: 600; font-size: 1rem; text-decoration: none; border: 2px solid transparent; cursor: pointer; font-family: var(--hb2-body); line-height: 1.2; text-align: center; }
.hb2-btn--warm { background: var(--hb2-warm); color: var(--hb2-ink) !important; }
.hb2-btn--warm:hover { background: var(--hb2-warm-hover); }
.hb2-btn--line { background: #fff; color: var(--hb2-ink) !important; border-color: var(--hb2-ink); }
.hb2-btn--line:hover { border-color: var(--hb2-prof); color: var(--hb2-prof) !important; }
.hb2-btn--dark { background: var(--hb2-prof-dark); color: #fff !important; }
.hb2-btn--ghostdark { background: transparent; color: #fff !important; border-color: #fff; }
.hb2-ico { width: 46px; height: 46px; border-radius: 50%; display: inline-grid; place-items: center; flex: none; }
.hb2-ico svg { width: 22px; height: 22px; }
.hb-ico { width: 46px; height: 46px; border-radius: 50%; display: inline-grid; place-items: center; flex: none; }
.hb-ico svg { width: 22px; height: 22px; }
.hb-ico--prof { background: var(--hb2-prof-tint); color: var(--hb2-prof); }
.hb-ico--warm { background: #FCE0C6; color: #A3510C; }
.hb-ico--cozy { background: #D3EBFA; color: #1D6E96; }
.hb-ico--health { background: #E2EFC6; color: var(--hb2-health-ink); }
.hb-ico--love { background: #FBD5D8; color: var(--hb2-love-ink); }
.hb-ico--sincere { background: #E9DCEE; color: var(--hb2-sincere-ink); }
.hb-ico--plain { width: 18px; height: 18px; background: none; color: var(--hb2-muted); }
.hb-ico--plain svg { width: 16px; height: 16px; }
.hb-ico--tick { width: 18px; height: 18px; background: none; color: var(--hb2-health-ink); }
.hb-ico--tick svg { width: 16px; height: 16px; }
.hb2-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.hb2-chips li { font-size: .78rem; padding: 3px 10px; border-radius: 999px; background: var(--hb2-cozy-tint); color: #1D5E80; }
.hb2-chips--lg li { font-size: .88rem; padding: 5px 12px; }
.hb2-chips li.hb2-chip--health { background: var(--hb2-health-tint); color: var(--hb2-health-ink); font-weight: 600; }
.hb2-note { font-size: .9rem; color: var(--hb2-muted); }

/* Home */
.hb2-home { padding: 0 !important; margin: 0 !important; max-width: none !important; }
.hb2-home > * { max-width: none !important; }
.hb2-hero { background: var(--hb2-cozy-tint); padding-block: 48px 56px; }
.hb2-hero__grid { display: grid; gap: 36px; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); align-items: center; }
.hb2-hero h1 { font-size: clamp(2.2rem, 1.4rem + 3vw, 3.6rem); line-height: 1.08; margin: 0 0 18px; }
.hb2-lead { font-size: 1.15rem; line-height: 1.55; color: var(--hb2-muted); max-width: 34em; margin: 0 0 24px; }
.hb2-search { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr) auto; gap: 0; background: #fff; border-radius: var(--hb2-r); padding: 8px; box-shadow: 0 2px 4px rgba(29, 38, 64, .05), 0 10px 30px rgba(29, 38, 64, .08); align-items: stretch; }
.hb2-search__f { display: grid; padding: 6px 14px; border-right: 1px solid var(--hb2-line); }
.hb2-search__f:nth-of-type(2) { border-right: 0; }
.hb2-search label { font-size: .78rem; font-weight: 600; color: var(--hb2-ink); }
.hb2-search select, .hb2-search input { border: 0; font: inherit; font-size: 1.05rem; padding: 4px 0; background: transparent; color: var(--hb2-ink); min-width: 0; }
.hb2-search select:focus, .hb2-search input:focus { outline: none; }
.hb2-search:focus-within { box-shadow: 0 0 0 3px #C9CDE6, 0 10px 30px rgba(29, 38, 64, .08); }
.hb2-search .hb2-btn { min-width: 130px; font-size: 1.05rem; }
.hb2-popular { margin: 14px 0 0; font-size: .95rem; color: var(--hb2-muted); }
.hb2-hero__media { position: relative; }
.hb2-hero__img { width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 22px; display: block; box-shadow: 0 18px 40px rgba(29, 38, 64, .14); }
.hb2-hero__cards { position: absolute; left: -28px; bottom: -20px; display: grid; gap: 8px; width: min(320px, 85%); }
.hb2-mini { background: #fff; border-radius: 12px; padding: 10px 14px; font-size: .9rem; box-shadow: 0 6px 18px rgba(29, 38, 64, .12); display: flex; align-items: center; gap: 8px; }
.hb2-mini--white { display: grid; gap: 2px; }
.hb2-mini small { color: var(--hb2-muted); font-size: .78rem; }
.hb2-mini i { width: 9px; height: 9px; border-radius: 50%; flex: none; }
.hb2-mini--green { background: var(--hb2-health-tint); } .hb2-mini--green i { background: #6B9A1F; }
.hb2-mini--peach { background: var(--hb2-warm-tint); } .hb2-mini--peach i { background: var(--hb2-warm); }
.hb2-caption { position: absolute; right: 8px; bottom: -40px; font-size: .75rem; color: var(--hb2-muted); margin: 0; }
.hb2-sec { padding-block: 44px 8px; }
.hb2-sec h2 { font-size: clamp(1.6rem, 1.3rem + 1vw, 2.1rem); margin: 0 0 18px; }
.hb2-sub { margin: -8px 0 20px; color: var(--hb2-muted); }
.hb2-head { display: flex; align-items: baseline; gap: 18px; flex-wrap: wrap; }
.hb2-head a { font-weight: 600; }
.hb2-tiles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 14px; }
.hb2-tile { display: flex; flex-direction: column; gap: 12px; height: 100%; box-sizing: border-box; padding: 18px; border: 1px solid var(--hb2-line); border-radius: var(--hb2-r); background: #fff; text-decoration: none; color: var(--hb2-ink); transition: box-shadow .15s, transform .15s; }
.hb2-tile:hover { box-shadow: 0 8px 24px rgba(29, 38, 64, .1); transform: translateY(-2px); }
.hb2-tile--warm { background: var(--hb2-warm-tint); border-color: #F7D6B5; }
.hb2-tile--health { background: var(--hb2-health-tint); border-color: #DCE9BE; }
.hb2-tile strong { display: block; font-size: 1.05rem; }
.hb2-tile em { display: block; font-style: normal; color: var(--hb2-muted); font-size: .92rem; margin-top: 2px; }
.hb2-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.hb2-step { position: relative; padding: 22px; border-radius: 18px; display: grid; gap: 8px; align-content: start; }
.hb2-step--cozy { background: var(--hb2-cozy-tint); } .hb2-step--warm { background: var(--hb2-warm-tint); } .hb2-step--health { background: var(--hb2-health-tint); }
.hb2-step__n { position: absolute; top: 18px; right: 20px; font-family: var(--hb2-display); font-weight: 900; font-size: 1.6rem; color: rgba(29, 38, 64, .18); }
.hb2-step h3 { margin: 6px 0 0; font-size: 1.15rem; }
.hb2-step p { margin: 0; color: var(--hb2-muted); line-height: 1.5; }
.hb2-cities { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 24px; }
.hb2-cities h3 { font-size: 1.05rem; margin: 0 0 8px; }
.hb2-cities ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.hb2-cities span { color: var(--hb2-muted); font-size: .85rem; }
.hb2-guides { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 16px; }
.hb2-guide { display: block; height: 100%; border: 1px solid var(--hb2-line); border-radius: var(--hb2-r); overflow: hidden; text-decoration: none; color: var(--hb2-ink); background: #fff; }
.hb2-guide:hover { box-shadow: 0 8px 24px rgba(29, 38, 64, .1); }
.hb2-guide__media { display: block; aspect-ratio: 16 / 9; }
.hb2-guide__img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hb2-tint--cozy { background: var(--hb2-cozy-tint); } .hb2-tint--warm { background: var(--hb2-warm-tint); } .hb2-tint--health { background: var(--hb2-health-tint); }
.hb2-guide__body { display: grid; gap: 4px; padding: 14px 16px 18px; }
.hb2-guide small { color: var(--hb2-muted); font-size: .8rem; }
.hb2-guide strong { font-family: var(--hb2-display); font-weight: 800; font-size: 1.1rem; line-height: 1.3; }
.hb2-banner { background: var(--hb2-prof-dark); color: #fff; border-radius: 20px; padding: 28px; display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.hb2-banner h2 { color: #fff; margin: 0 0 6px; font-size: 1.6rem; }
.hb2-banner p { margin: 0; color: #D8DCF0; max-width: 38em; }
.hb2-banner__actions { display: flex; gap: 10px; flex-wrap: wrap; }
.hb2-credit { font-size: .75rem; color: var(--hb2-muted); padding-block: 8px 24px; }
.hb2-credit a { color: var(--hb2-muted); }
@media (max-width: 860px) {
	.hb2-hero__grid { grid-template-columns: minmax(0, 1fr); }
	.hb2-hero__cards { left: 12px; bottom: -16px; }
	.hb2-caption { display: none; }
	.hb2-hero { padding-block: 32px 48px; }
}
@media (max-width: 600px) {
	.hb2-search { grid-template-columns: minmax(0, 1fr); }
	.hb2-search__f { border-right: 0; border-bottom: 1px solid var(--hb2-line); }
	.hb2-search .hb2-btn { margin-top: 8px; }
	.hb2-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Two-column pages (city, clinic) */
.hb2-cols { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 28px; align-items: start; margin-top: 8px; }
.hb2-side { display: grid; gap: 16px; }
.hb2-side--sticky { position: sticky; top: 16px; }
.hb2-box { border: 1px solid var(--hb2-line); border-radius: var(--hb2-r); padding: 18px; background: #fff; }
.hb2-box h2 { font-size: 1.15rem; margin: 0 0 8px; }
.hb2-box p { margin: 0 0 12px; color: var(--hb2-muted); font-size: .95rem; }
.hb2-box--warm { background: var(--hb2-warm-tint); border-color: #F7D6B5; }
.hb2-box--health { background: var(--hb2-health-tint); border-color: #DCE9BE; }
.hb2-box--health small { font-size: .78rem; color: var(--hb2-health-ink); font-weight: 600; }
.hb2-box--form { box-shadow: 0 6px 24px rgba(29, 38, 64, .07); }
.hb2-box--form h2 { font-size: 1.35rem; }
.hb2-sidelist { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.hb2-sidelist small { display: block; color: var(--hb2-muted); font-size: .85rem; }
.hb2-more { font-weight: 600; font-size: .92rem; display: inline-block; margin-top: 10px; }
.hb2-hoods { line-height: 1.9; }
@media (max-width: 960px) {
	.hb2-cols { grid-template-columns: minmax(0, 1fr); }
	.hb2-side--sticky { position: static; }
}

/* City rows */
.hb2-rows { display: grid; gap: 14px; }
.hb2-row { display: grid; grid-template-columns: 64px minmax(0, 1fr) 190px; gap: 16px; padding: 18px; border: 1px solid var(--hb2-line); border-radius: var(--hb2-r); background: #fff; align-items: start; }
.hb2-row--featured { border-color: var(--hb2-warm); box-shadow: 0 0 0 2px var(--hb2-warm-tint); }
.hb2-row__tile { width: 64px; height: 64px; border-radius: 14px; overflow: hidden; display: grid; place-items: center; background: var(--hb2-prof-tint); text-decoration: none; }
.hb2-row--featured .hb2-row__tile { background: var(--hb2-warm-tint); }
.hb2-row__tile .hb-mono { aspect-ratio: auto; width: 100%; height: 100%; background: none; font-size: 1.3rem; color: var(--hb2-prof); }
.hb2-row__img { width: 100%; height: 100%; object-fit: cover; }
.hb2-row__tile--lg { width: 88px; height: 88px; border-radius: 18px; flex: none; }
.hb2-row__tile--lg .hb-mono { font-size: 1.8rem; }
.hb2-row__body { display: grid; gap: 6px; min-width: 0; }
.hb2-row h3 { margin: 0; font-size: 1.15rem; line-height: 1.3; }
.hb2-row h3 a { color: var(--hb2-ink); text-decoration: none; }
.hb2-row h3 a:hover { color: var(--hb2-prof); }
.hb2-row__meta { margin: 0; font-size: .9rem; color: var(--hb2-muted); }
.hb2-row__sum { margin: 0; font-size: .93rem; line-height: 1.5; }
.hb2-flags { margin: 0; display: flex; gap: 6px; }
.hb2-flag { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; padding: 2px 8px; border-radius: 6px; }
.hb2-flag--feat { background: var(--hb2-warm-tint); color: #A3510C; }
.hb2-flag--ver { background: var(--hb2-health-tint); color: var(--hb2-health-ink); }
.hb2-row__act { display: grid; gap: 8px; }
.hb2-row__act .hb2-btn { min-height: 42px; padding: 0 12px; font-size: .95rem; }
.hb2-row__act small { color: var(--hb2-muted); font-size: .8rem; text-align: center; line-height: 1.35; }
@media (max-width: 680px) {
	.hb2-row { grid-template-columns: 52px minmax(0, 1fr); }
	.hb2-row__tile { width: 52px; height: 52px; }
	.hb2-row__act { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; }
	.hb2-row__act small { grid-column: 1 / -1; }
}

/* Clinic page */
.hb2-lhead { display: grid; gap: 14px; padding-block: 8px 4px; }
.hb2-lhead__top { display: flex; gap: 18px; align-items: center; }
.hb2-lhead h1 { margin: 0 0 4px; font-size: clamp(1.8rem, 1.3rem + 1.8vw, 2.6rem); line-height: 1.1; }
.hb2-lhead__sub { margin: 0; color: var(--hb2-muted); }
.hb2-lhead__rating { margin: 4px 0 0; }
.hb2-lactions { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.hb2-lock { margin: 0; display: flex; gap: 6px; align-items: center; font-size: .9rem; color: var(--hb2-muted); flex-wrap: wrap; }
.hb2-alert { display: flex; gap: 12px; align-items: flex-start; background: var(--hb2-warm-tint); border-radius: var(--hb2-r); padding: 14px 16px; margin: 16px 0 4px; }
.hb2-alert .hb-ico { width: 36px; height: 36px; }
.hb2-alert .hb-ico svg { width: 18px; height: 18px; }
.hb2-alert .hb-er { all: unset; }
.hb2-tabs { display: flex; gap: 4px; overflow-x: auto; border-bottom: 1px solid var(--hb2-line); margin: 20px 0 4px; position: sticky; top: 0; background: #fff; z-index: 5; scrollbar-width: none; }
.hb2-tabs a { padding: 12px 12px; white-space: nowrap; color: var(--hb2-muted); text-decoration: none; font-weight: 600; border-bottom: 3px solid transparent; }
.hb2-tabs a:hover { color: var(--hb2-ink); border-bottom-color: var(--hb2-warm); }
.hb2-lsec { padding-block: 18px 6px; scroll-margin-top: 60px; }
.hb2-lsec h2 { font-size: 1.45rem; margin: 0 0 12px; }
.hb2-lsec p { line-height: 1.6; }
.hb2-twocol { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 0 28px; }
.hb2-table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.hb2-table th, .hb2-table td { text-align: left; vertical-align: top; padding: 9px 10px 9px 0; border-bottom: 1px solid var(--hb2-line); }
.hb2-table th { font-weight: 600; width: 38%; }
.hb2-svc { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 8px 16px; }
.hb2-svc li { display: flex; align-items: center; gap: 6px; }
.hb2-ticks { padding-left: 1.1em; margin: 0; display: grid; gap: 4px; }
.hb2-team { list-style: none; margin: 0 0 8px; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.hb2-team a { display: flex; gap: 12px; align-items: center; padding: 10px; border: 1px solid var(--hb2-line); border-radius: 12px; text-decoration: none; color: var(--hb2-ink); }
.hb2-team a:hover { border-color: var(--hb2-prof); }
.hb2-team .hb-mono, .hb2-team__img { width: 44px; height: 44px; border-radius: 50%; aspect-ratio: auto; font-size: 1rem; flex: none; object-fit: cover; background: var(--hb2-prof-tint); }
.hb2-team span { display: grid; min-width: 0; }
.hb2-team small { color: var(--hb2-muted); font-size: .82rem; }
.hb2-empty { display: flex; gap: 14px; align-items: center; padding: 16px; border: 1px dashed #CBD2E1; border-radius: var(--hb2-r); margin: 18px 0 4px; }
.hb2-empty p { margin: 0; color: var(--hb2-muted); }
.hb2-faq { border-bottom: 1px solid var(--hb2-line); padding: 12px 0; }
.hb2-faq summary { cursor: pointer; font-weight: 600; }
.hb2-faq p { margin: 8px 0 0; color: var(--hb2-muted); }
.hb2-near { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; }
.hb2-near a { display: grid; gap: 2px; padding: 12px 14px; border: 1px solid var(--hb2-line); border-radius: 12px; text-decoration: none; color: var(--hb2-ink); height: 100%; box-sizing: border-box; }
.hb2-near small { color: var(--hb2-muted); }
.hb2-facts { font-size: .85rem; color: var(--hb2-muted); margin: 24px 0 8px; }
.hb2-box--form .hb-form { margin: 0; gap: 12px; max-width: none; }
.hb2-box--form .hb-form .hb-btn { justify-self: stretch; background: var(--hb2-warm); border-color: var(--hb2-warm); color: var(--hb2-ink) !important; min-height: 48px; font-size: 1.05rem; }
.hb2-box--form .hb-form .hb-btn:hover { background: var(--hb2-warm-hover); }
.hb-pets { border: 0; padding: 0; margin: 0; display: flex; gap: 8px; flex-wrap: wrap; }
.hb-pets legend { font-weight: 600; margin-bottom: 6px; padding: 0; }
.hb-pets label { display: inline-flex; align-items: center; gap: 6px; padding: 9px 14px; border: 1px solid var(--hb2-line); border-radius: 10px; cursor: pointer; }
.hb-pets label:has(input:checked) { border-color: var(--hb2-warm); background: var(--hb2-warm-tint); }

/* Collection chips: active = Profession */
.hb-quick a.is-active { background: var(--hb2-prof); border-color: var(--hb2-prof); color: #fff; }

/* Footer */
.hb-footer { background: var(--hb2-prof-dark); color: #D8DCF0; margin-top: 48px; }
.hb2-foot { padding-block: 26px 22px; display: grid; gap: 14px; }
.hb2-foot__row { display: flex; align-items: center; gap: 14px 28px; flex-wrap: wrap; }
.hb2-foot__row ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 20px; flex: 1 1 auto; }
.hb2-foot a { color: #fff; text-decoration: none; font-size: .92rem; }
.hb2-foot a:hover { text-decoration: underline; }
.hb2-foot__row p { margin: 0; font-size: .85rem; color: #AEB4D6; }
.hb2-foot__legal { font-size: .82rem; color: #AEB4D6; border-top: 1px solid rgba(255, 255, 255, .12); padding-top: 12px; }
.hb2-foot__legal a { font-size: .82rem; color: #D8DCF0; }
@media (prefers-reduced-motion: reduce) { .hb2-tile, .hb2-guide { transition: none; } .hb2-tile:hover { transform: none; } }
.hb-art-photo { margin: 0 0 20px; }
.hb-art-photo img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 16px; display: block; }
.hb-art-photo figcaption { font-size: .78rem; color: var(--hb2-muted); margin-top: 6px; }

/* Parent theme sets ~20px light body text; the mock uses 16px regular. */
body { font-size: 16px; font-weight: 400; line-height: 1.55; }
strong, b, th { font-weight: 600; }
.hb2-tile strong, .hb2-guide strong { font-weight: 800; font-family: var(--hb2-display); }
.hb-article .wp-block-post-content { font-size: 1.075rem; line-height: 1.7; }
/* City heading on a full-width Cozy band, as in the mock */
.hb-directory > .hb-pagehead { background: var(--hb2-cozy-tint); box-shadow: 0 0 0 100vmax var(--hb2-cozy-tint); clip-path: inset(0 -100vmax); padding-block: 18px 22px; margin-bottom: 14px; }
.hb-directory > .hb-pagehead h1 { margin-top: 0; }
.hb-directory > .hb-pagehead .hb-lead { color: var(--hb2-muted); }
.hb-pets { gap: 6px; flex-wrap: nowrap; }
.hb-pets label { padding: 8px 10px; flex: 1 1 0; justify-content: center; font-size: .95rem; }

/* v2.1 navigation: dropdowns (details/summary; no script) */
.hb2-dd { position: relative; }
.hb2-dd summary { list-style: none; cursor: pointer; font-weight: 500; color: var(--hb2-ink); display: inline-flex; align-items: center; gap: 6px; padding: 6px 0; }
.hb2-dd summary::-webkit-details-marker { display: none; }
.hb2-dd summary::after { content: ""; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); }
.hb2-dd summary:hover, .hb2-dd summary[aria-current] { color: var(--hb2-prof); }
.hb2-dd ul { list-style: none; margin: 0; padding: 8px; position: absolute; top: calc(100% + 8px); left: -12px; min-width: 220px; background: #fff; border: 1px solid var(--hb2-line); border-radius: 12px; box-shadow: 0 12px 32px rgba(29, 38, 64, .12); display: grid; z-index: 30; }
.hb2-dd ul a { display: block; padding: 9px 12px; border-radius: 8px; }
.hb2-dd ul a:hover { background: var(--hb2-prof-tint); color: var(--hb2-prof); }
@media (max-width: 760px) {
	.hb2-dd ul { position: static; box-shadow: none; border: 0; padding: 0 0 6px 12px; min-width: 0; }
	.hb2-dd summary { padding: 12px 0; width: 100%; justify-content: space-between; }
	.hb2-nav__list > li { border-bottom: 1px solid var(--hb2-line); }
	.hb2-nav__list > li:last-child { border-bottom: 0; }
}

/* v2.1 footer: four columns */
.hb2-foot { padding-block: 34px 22px; display: grid; gap: 22px; }
.hb2-foot__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 22px; }
.hb2-foot__col h3 { color: #fff; font-size: .95rem; margin: 0 0 10px; }
.hb2-foot__col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.hb2-foot__col a { color: #D8DCF0; }
.hb2-logo--light span { color: #fff !important; }

/* v2.1: vet profiles, author box, sticky phone bar, finder, 404, Picks box */
.hb2-vet { max-width: 860px; }
.hb2-vet .hb-vet__head { display: flex; gap: 20px; align-items: center; padding-block: 12px 8px; }
.hb2-vet__tile { width: 104px; height: 104px; border-radius: 50%; overflow: hidden; background: var(--hb2-prof-tint); display: grid; place-items: center; flex: none; }
.hb2-vet__tile img { width: 100%; height: 100%; object-fit: cover; }
.hb2-vet__tile .hb-mono { aspect-ratio: auto; width: 100%; height: 100%; background: none; font-size: 2rem; color: var(--hb2-prof); }
.hb2-vet h1 { margin: 0 0 4px; font-size: clamp(1.8rem, 1.3rem + 1.6vw, 2.4rem); }
.hb2-vet .hb-vet__cred { color: var(--hb2-muted); font-weight: 700; }
.hb2-vet .hb-section { border-top: 1px solid var(--hb2-line); }
.hb2-vet .hb-inline-cta { border-radius: var(--hb2-r); }
.hb-authorbox { display: flex; gap: 14px; align-items: flex-start; padding: 18px; margin: 28px 0 8px; border: 1px solid var(--hb2-line); border-radius: var(--hb2-r); background: var(--hb2-surface); }
.hb-authorbox__mark { width: 48px; height: 48px; border-radius: 50%; background: var(--hb2-warm); color: var(--hb2-ink); display: grid; place-items: center; font-family: var(--hb2-display); font-weight: 900; font-size: 1.3rem; flex: none; }
.hb-authorbox p { margin: 0 0 6px; }
.hb2-mbar { display: none; }
@media (max-width: 960px) {
	.hb2-mbar { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; background: #fff; border-top: 1px solid var(--hb2-line); padding: 10px max(16px, env(safe-area-inset-right, 0px)) calc(10px + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px)); box-shadow: 0 -6px 18px rgba(29, 38, 64, .08); }
	.hb2-cols--listing { padding-bottom: 80px; }
	.hb-sticky-bar { display: none !important; }
}
.hb-finder { display: grid; gap: 8px; margin: 20px 0; padding: 18px; background: var(--hb2-warm-tint); border-radius: var(--hb2-r); }
.hb-finder label { font-weight: 700; font-family: var(--hb2-display); font-size: 1.15rem; }
.hb-finder__row { display: flex; gap: 8px; flex-wrap: wrap; }
.hb-finder__row input { flex: 1 1 240px; min-height: 46px; padding: 0 14px; border: 1px solid #E8C9A8; border-radius: 10px; font: inherit; background: #fff; }
.hb-finder__hits { list-style: none; margin: 0 0 20px; padding: 0; display: grid; gap: 8px; }
.hb-finder__hits li { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border: 1px solid var(--hb2-line); border-radius: 12px; }
.hb-finder__hits span { display: grid; min-width: 0; }
.hb-finder__hits small { color: var(--hb2-muted); }
.hb-finder__hits em { font-style: normal; color: var(--hb2-muted); font-size: .9rem; }
.hb2-404 { padding-block: 40px; }
.hb2-404__code { font-family: var(--hb2-display); font-weight: 900; font-size: 4rem; color: var(--hb2-warm); margin: 0; line-height: 1; }
.hb2-box--pick { background: var(--hb2-warm-tint); border-color: #F7D6B5; }
.hb2-box--pick small { font-size: .78rem; color: #A3510C; font-weight: 600; }
.hb2-empty .hb2-btn { margin-left: auto; flex: none; }
@media (max-width: 600px) { .hb2-empty { flex-wrap: wrap; } .hb2-empty .hb2-btn { margin-left: 0; } }

/* v2.2: open-now dots, toolbar, contents list, glossary definition, not-covered box, review card */
.hb2-dot { display: inline-flex; align-items: center; gap: 5px; font-weight: 600; font-size: .85rem; margin-right: 8px; }
.hb2-dot::before { content: ""; width: 8px; height: 8px; border-radius: 50%; }
.hb2-dot--open { color: #3F6B0F; } .hb2-dot--open::before { background: #5C9A1B; }
.hb2-dot--closed { color: var(--hb2-muted); } .hb2-dot--closed::before { background: #B8BFD0; }
.hb2-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 10px 16px; flex-wrap: wrap; margin: 6px 0 12px; }
.hb2-toolbar p { margin: 0; color: var(--hb2-muted); font-size: .95rem; }
.hb2-toolbar__ctl { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; font-size: .92rem; }
.hb2-toggle { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border: 1px solid var(--hb2-line); border-radius: 999px; text-decoration: none; color: var(--hb2-ink); font-weight: 600; }
.hb2-toggle i { width: 28px; height: 16px; border-radius: 999px; background: #D5DAE6; position: relative; }
.hb2-toggle i::after { content: ""; position: absolute; top: 2px; left: 2px; width: 12px; height: 12px; border-radius: 50%; background: #fff; transition: left .15s; }
.hb2-toggle.is-on { border-color: #5C9A1B; background: var(--hb2-health-tint); }
.hb2-toggle.is-on i { background: #5C9A1B; } .hb2-toggle.is-on i::after { left: 14px; }
.hb2-sort a { color: var(--hb2-muted); text-decoration: none; }
.hb2-sort a[aria-current] { color: var(--hb2-prof); font-weight: 700; }
.hb-toc { margin: 4px 0 18px; padding: 12px 16px; border: 1px solid var(--hb2-line); border-radius: var(--hb2-r); background: #fff; }
.hb-toc summary { cursor: pointer; font-weight: 700; font-family: var(--hb2-display); }
.hb-toc ol { margin: 8px 0 0; padding-left: 1.3em; display: grid; gap: 4px; }
.hb-toc a { text-decoration: none; }
.hb-toc a:hover { text-decoration: underline; }
.hb-article .wp-block-post-content h2 { scroll-margin-top: 20px; }
.single-hb_glossary .hb-article .wp-block-post-content > p:first-of-type { background: var(--hb2-cozy-tint); border-left: 4px solid #7DCBF2; border-radius: 10px; padding: 14px 18px; font-size: 1.1rem; }
.single-hb_glossary .hb-article .wp-block-post-content > p:first-of-type::before { content: "In short"; display: block; font-family: var(--hb2-display); font-weight: 800; font-size: .85rem; color: #1D6E96; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 4px; }
.hb2-nf { margin: 6px 0 22px; }
.hb-review-card { background: var(--hb2-health-tint); border-radius: var(--hb2-r); padding: 18px !important; border: 0 !important; }
.hb-review-card .hb-pets { flex-wrap: wrap; }
.hb-review-card .hb-pets label { flex: 0 1 auto; }
@media (prefers-reduced-motion: reduce) { .hb2-toggle i::after { transition: none; } }

/* v2.3: home is all white boxes; colour only in the icon circles */
.hb2-tile, .hb2-tile--warm, .hb2-tile--health { background: #fff; border-color: var(--hb2-line); }
.hb2-step, .hb2-step--cozy, .hb2-step--warm, .hb2-step--health { background: #fff; border: 1px solid var(--hb2-line); }
.hb2-tint--cozy, .hb2-tint--warm, .hb2-tint--health { background: var(--hb2-surface); }
.hb-picks__note { margin: -6px 0 12px; font-size: .82rem; color: var(--hb2-muted); }
.hb-locate { justify-self: start; background: none; border: 0; padding: 4px 0 0; color: var(--hb2-prof); font: inherit; font-size: .85rem; font-weight: 600; cursor: pointer; text-decoration: underline; }
.hb-locate__msg { font-size: .82rem; color: var(--hb2-muted); }
.hb2-search__f .hb-locate { padding-top: 2px; }

/* v2.4: UX pass (phone + desktop) */
/* One white box style everywhere; tint kept only for warnings */
.hb-finder, .hb2-box--warm, .hb2-box--pick, .hb2-box--health { background: #fff; border: 1px solid var(--hb2-line); }
.hb-finder__row input { border-color: var(--hb2-line); }
.hb2-box--form { box-shadow: 0 6px 24px rgba(29, 38, 64, .07); }
/* Picks buttons match the site's orange buttons */
.hb-btn--warm { background: var(--hb2-warm); border-color: var(--hb2-warm); color: var(--hb2-ink) !important; }
.hb-btn--warm:hover { background: var(--hb2-warm-hover); border-color: var(--hb2-warm-hover); }
/* Lock note: icon stays beside the text */
.hb2-lock { flex-wrap: nowrap; align-items: flex-start; }
.hb2-lock .hb-ico { margin-top: 2px; }
/* Phone action bar slides in after the header buttons scroll away */
@media (max-width: 960px) {
	.hb2-mbar--auto { transform: translateY(110%); transition: transform .2s ease; }
	.hb2-mbar--auto.is-shown { transform: none; }
}
@media (prefers-reduced-motion: reduce) { .hb2-mbar--auto { transition: none; } }
@media (max-width: 700px) {
	/* City page filters: one swipeable row instead of seven wrapped rows */
	.hb-quick--colls { flex-wrap: nowrap; overflow-x: auto; margin-inline: -16px; padding-inline: 16px; scroll-padding-inline: 16px; }
	.hb-quick--colls a { min-height: 38px; }
	/* Result cards: name beside a small tile, text uses the full width */
	.hb2-row { grid-template-columns: 44px minmax(0, 1fr); gap: 6px 12px; padding: 16px; }
	.hb2-row__tile { width: 44px; height: 44px; border-radius: 12px; }
	.hb2-row__tile .hb-mono { font-size: 1.05rem; }
	.hb2-row__body { display: contents; }
	.hb2-row__body > h3 { grid-column: 2; align-self: center; font-size: 1.08rem; }
	.hb2-row__body > :not(h3) { grid-column: 1 / -1; }
	.hb2-row__sum { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
	.hb2-row__act { margin-top: 6px; }
	/* Clinic header: smaller tile so the name has room */
	.hb2-lhead__top { gap: 12px; align-items: flex-start; }
	.hb2-row__tile--lg { width: 56px; height: 56px; border-radius: 14px; }
	.hb2-row__tile--lg .hb-mono { font-size: 1.3rem; }
	.hb2-lhead h1 { font-size: 1.7rem; }
	/* Home: cities in two columns */
	.hb2-cities ul { grid-template-columns: 1fr 1fr; }
}

/* v2.5: phone menu with vet search, Bobbie's photo, newsletter */
.hb2-nav__find { display: none; }
@media (max-width: 960px) {
	.hb2-nav__list { position: fixed; top: var(--hb2-hdr, 64px); left: 0; right: 0; width: 100%; box-sizing: border-box; max-height: calc(100dvh - var(--hb2-hdr, 64px)); overflow-y: auto; padding: 4px 20px 24px; box-shadow: 0 16px 32px rgba(29, 38, 64, .12); z-index: 60; }
	.hb2-nav__find { display: block; order: -1; border-bottom: 0 !important; padding: 12px 0 8px; }
	.hb2-nav__find form { display: grid; gap: 8px; background: var(--hb2-surface); border: 1px solid var(--hb2-line); border-radius: var(--hb2-r); padding: 14px; }
	.hb2-nav__find label { font-family: var(--hb2-display); font-weight: 800; font-size: 1.05rem; }
	.hb2-nav__findrow { display: flex; gap: 8px; }
	.hb2-nav__findrow input { flex: 1 1 auto; min-width: 0; min-height: 46px; padding: 0 12px; border: 1px solid var(--hb2-line); border-radius: 10px; font: inherit; background: #fff; }
	.hb2-nav__findrow .hb2-btn { padding: 0 16px; }
	.hb2-nav__find .hb-locate { padding: 0; }
	body:has(.hb2-nav__toggle:checked) { overflow: hidden; }
}
/* How it works: compact rows on phones */
@media (max-width: 700px) {
	.hb2-step { grid-template-columns: 46px minmax(0, 1fr); column-gap: 14px; row-gap: 2px; padding: 16px; }
	.hb2-step .hb-ico { grid-row: 1 / span 2; }
	.hb2-step h3 { margin: 0; font-size: 1.05rem; align-self: end; }
	.hb2-step p { grid-column: 2; font-size: .95rem; }
	.hb2-step__n { display: none; }
}
/* Bobbie */
.hb-art-byline { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.hb-art-byline__img { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; flex: none; }
.hb-authorbox { background: #fff; }
.hb-authorbox__img { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; flex: none; }
@media (max-width: 600px) { .hb-authorbox__img { width: 56px; height: 56px; } }
.hb-editor-photo { margin: 0 0 20px; }
.hb-editor-photo img { width: 200px; height: 200px; border-radius: 50%; object-fit: cover; }
/* Newsletter */
.hb-news { margin: 32px 0 8px; padding: 22px; border: 1px solid var(--hb2-line); border-radius: var(--hb2-r); background: #fff; box-shadow: 0 6px 24px rgba(29, 38, 64, .06); scroll-margin-top: 20px; }
.hb-news__head { display: flex; gap: 14px; align-items: flex-start; }
.hb-news h2 { margin: 0 0 6px; font-size: 1.3rem; }
.hb-news__head p { margin: 0; color: var(--hb2-muted); line-height: 1.55; }
.hb-news__form { display: grid; gap: 10px; margin-top: 16px; }
.hb-news__row { display: flex; gap: 8px; flex-wrap: wrap; }
.hb-news__row input { flex: 1 1 220px; min-width: 0; min-height: 48px; padding: 0 14px; border: 1px solid var(--hb2-line); border-radius: 10px; font: inherit; }
.hb-news__row .hb2-btn { flex: 0 0 auto; }
.hb-news__pets { border: 0; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: .92rem; }
.hb-news__pets legend { padding: 0; margin-bottom: 4px; color: var(--hb2-muted); font-size: .88rem; }
.hb-news__pets label { display: inline-flex; gap: 6px; align-items: center; }
.hb-news__small { margin: 0; font-size: .82rem; color: var(--hb2-muted); }
@media (max-width: 600px) { .hb-news__head .hb-ico { display: none; } .hb-news__row .hb2-btn { flex: 1 1 100%; } }

/* v2.6: clinic logo + photo, reCAPTCHA */
.hb2-row__logo { width: 100%; height: 100%; object-fit: contain; padding: 6px; border-radius: 0; }
.hb2-lphoto { margin: 12px 0 0; padding: 0; border-radius: var(--hb2-r); overflow: hidden; }
.hb2-lphoto__img { display: block; width: 100%; height: auto; max-height: 340px; object-fit: cover; }
.hb2-lphoto__credit { font-size: .78rem; color: var(--hb2-muted); padding: 6px 0 0; }
@media (max-width: 700px) { .hb2-lphoto__img { max-height: 220px; } }
.hb-recaptcha-notice { font-size: .72rem; color: var(--hb2-muted); margin: 4px 0 0; }

/* v2.7: header search bar */
.hb2-nav__search { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.hb2-nav__searchbtn { background: none; border: 0; cursor: pointer; padding: 6px; display: grid; place-items: center; }
.hb2-nav__searchbtn .hb-ico { width: 24px; height: 24px; } .hb2-nav__searchbtn .hb-ico svg { width: 20px; height: 20px; }
.hb2-nav__searchbox { display: none; align-items: center; gap: 6px; }
.hb2-nav__searchbox.is-open { display: flex; }
.hb2-nav__searchbox input[type="search"] { width: 220px; min-height: 38px; padding: 0 12px; border: 1px solid var(--hb2-line); border-radius: 8px; font: inherit; font-size: .95rem; background: var(--hb2-surface); }
.hb2-nav__searchbox input[type="search"]:focus { border-color: var(--hb2-prof); outline: none; box-shadow: 0 0 0 3px rgba(71, 83, 162, .12); }
.hb2-btn--sm { min-height: 38px; padding: 0 14px; font-size: .92rem; border-radius: 8px; }
@media (max-width: 960px) {
	.hb2-nav__search { display: none; }
}
/* Search results banner on city pages */
.hb2-search-banner { display: flex; align-items: center; gap: 12px; margin: 8px 0 16px; padding: 12px 16px; background: var(--hb2-surface); border-radius: var(--hb2-r); }
.hb2-search-banner p { margin: 0; flex: 1; }
.hb2-search-banner strong { color: var(--hb2-prof); }
.hb2-search-banner a { font-weight: 600; white-space: nowrap; }