/* browse.css — /alerts/browse/ filtering hub. */
.browse-hero { max-width: 880px; margin: 0 auto; padding: 40px 20px 24px; text-align: center; }
.browse-hero h1 { font-family: var(--font-display, "Cormorant Garamond", Georgia, serif); font-size: clamp(2rem, 5vw, 3rem); color: var(--purple-900, #2a1f4a); margin: 12px 0 14px; }
.browse-hero__lede { font-size: 1.05rem; line-height: 1.55; color: var(--purple-800, #3a2e5a); max-width: 720px; margin: 0 auto; }

.browse-filters { max-width: 1080px; margin: 0 auto; padding: 24px 20px 4px; }
.browse-filters__row { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; margin-bottom: 14px; }
.browse-filters__row--chips { gap: 26px; }
.browse-filters__count { font-size: .88rem; color: var(--purple-700, #5a4a7a); margin: 8px 0 14px; }

.browse-search { flex: 1; display: block; }
.browse-search input { width: 100%; padding: 14px 18px; border: 1.5px solid rgba(58, 46, 90, 0.18); border-radius: 12px; font-size: 1rem; font-family: inherit; background: #fff; color: var(--purple-900, #2a1f4a); }
.browse-search input:focus { outline: none; border-color: var(--gold-500, #c9a665); box-shadow: 0 0 0 3px rgba(212, 160, 23, 0.12); }

.browse-chip-group { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.browse-chip-group__label { font-size: .8rem; letter-spacing: .04em; text-transform: uppercase; color: var(--purple-700, #5a4a7a); margin-right: 8px; }
.browse-chip { background: #fff; border: 1px solid rgba(58, 46, 90, 0.18); padding: 7px 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: .85rem; color: var(--purple-800, #3a2e5a); transition: all .15s ease; }
.browse-chip:hover { border-color: var(--gold-500, #c9a665); }
.browse-chip.is-active { background: var(--purple-900, #2a1f4a); color: var(--gold-300, #e4d2ae); border-color: var(--purple-900, #2a1f4a); }

.browse-grid { max-width: 1180px; margin: 16px auto 64px; padding: 0 20px; }
.browse-grid__list { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.browse-card { display: block; }
.browse-card a { display: block; background: #fff; border: 1px solid rgba(58, 46, 90, 0.12); border-radius: 12px; padding: 18px; text-decoration: none; color: var(--purple-900, #2a1f4a); transition: all .15s ease; position: relative; height: 100%; }
.browse-card a:hover { border-color: var(--gold-500, #c9a665); transform: translateY(-2px); box-shadow: 0 6px 16px rgba(42, 31, 74, 0.08); }
.browse-card__cat { display: inline-block; font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; color: var(--gold-700, #8a6a38); margin-bottom: 8px; font-weight: 600; }
.browse-card__name { display: block; font-family: var(--font-display, "Cormorant Garamond", Georgia, serif); font-size: 1.2rem; line-height: 1.2; margin-bottom: 6px; color: var(--purple-900, #2a1f4a); }
.browse-card__loc { display: block; font-size: .85rem; color: var(--purple-700, #5a4a7a); margin-bottom: 10px; }
.browse-card__chip { display: block; font-size: .78rem; color: var(--purple-800, #3a2e5a); padding: 6px 10px; background: var(--cream-50, #fdfbf6); border-radius: 6px; margin-bottom: 10px; }
.browse-card__stats { display: block; font-size: .78rem; color: var(--purple-700, #5a4a7a); padding-top: 10px; border-top: 1px solid rgba(58, 46, 90, 0.08); }
.browse-card__stats [data-stat="watchers"] { font-weight: 700; color: var(--gold-700, #8a6a38); }
.browse-grid__empty { text-align: center; padding: 48px 20px; color: var(--purple-700, #5a4a7a); }

.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }
