/* BIA-242 — public homepage + member pages. Versioned in the FILENAME (the CDN ignores
   query strings): rename to public-site-v3.css when you change it (v2: 2026-09-14, CTA card contrast).
   Everything is scoped under .bia-public so a site's own {DomainKey}.css can override
   colours via the custom properties below without fighting selectors. */

.bia-public {
	--bp-bg: #ffffff;
	--bp-fg: #1f2933;
	--bp-muted: #52606d;
	--bp-line: #e4e7eb;
	--bp-accent: #1f6feb;
	--bp-accent-fg: #ffffff;
	--bp-card: #f8fafc;
	--bp-radius: 12px;
	--bp-max: 960px;
	margin: 0;
	background: var(--bp-bg);
	color: var(--bp-fg);
	font: 16px/1.55 system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	-webkit-font-smoothing: antialiased;
}
.bia-public a { color: var(--bp-accent); }
.bia-public h1, .bia-public h2 { line-height: 1.2; margin: 0 0 .5rem; }
.bia-public h1 { font-size: clamp(1.6rem, 4vw, 2.4rem); }
.bia-public h2 { font-size: 1.15rem; color: var(--bp-muted); text-transform: uppercase; letter-spacing: .04em; }

/* header / nav */
.bia-public__header {
	display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
	max-width: var(--bp-max); margin: 0 auto; padding: .9rem 1rem; border-bottom: 1px solid var(--bp-line);
}
.bia-public__brand { display: flex; align-items: center; gap: .6rem; text-decoration: none; color: inherit; font-weight: 600; }
.bia-public__logo { height: 40px; width: auto; max-width: 160px; object-fit: contain; }
.bia-public__nav { display: flex; gap: .25rem 1rem; flex-wrap: wrap; align-items: center; }
.bia-public__nav a { text-decoration: none; color: var(--bp-fg); padding: .35rem 0; }
.bia-public__nav a:hover { color: var(--bp-accent); }
.bia-public__nav-cta { background: var(--bp-accent); color: var(--bp-accent-fg) !important; padding: .45rem .9rem !important; border-radius: 999px; }

/* main */
.bia-public__main { max-width: var(--bp-max); margin: 0 auto; padding: 1.5rem 1rem 3rem; }

/* homepage */
.bia-public__hero { text-align: center; padding: 1.5rem 0 2rem; }
.bia-public__hero-logo { max-height: 120px; max-width: min(70vw, 360px); width: auto; object-fit: contain; margin-bottom: 1rem; }
.bia-public__welcome { max-width: 40rem; margin: 0 auto; color: var(--bp-muted); font-size: 1.1rem; }
.bia-public__links { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; }
.bia-public .bia-public__card {
	display: flex; flex-direction: column; gap: .35rem; text-decoration: none; color: var(--bp-fg);
	background: var(--bp-card); border: 1px solid var(--bp-line); border-radius: var(--bp-radius); padding: 1.1rem 1.2rem;
	transition: transform .12s ease, box-shadow .12s ease;
}
.bia-public__card:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,.08); }
.bia-public__card-title { font-weight: 700; font-size: 1.05rem; }
.bia-public__card-text { color: var(--bp-muted); font-size: .95rem; }
/* Specificity note: `.bia-public a` (0,1,1) used to beat `.bia-public__card--cta` (0,1,0),
   so the CTA text rendered accent-on-accent — an opaque blue box. Keep these selectors
   at (0,2,0)+ so they win over the generic link rule and over site stylesheets. */
.bia-public .bia-public__card--cta,
.bia-public .bia-public__card--cta:hover,
.bia-public .bia-public__card--cta .bia-public__card-title,
.bia-public .bia-public__card--cta .bia-public__card-text { background: var(--bp-accent); border-color: var(--bp-accent); color: var(--bp-accent-fg); }
.bia-public .bia-public__card--cta .bia-public__card-title,
.bia-public .bia-public__card--cta .bia-public__card-text { background: transparent; }
.bia-public .bia-public__card--cta .bia-public__card-text { opacity: .9; }
.bia-public .bia-public__nav-cta,
.bia-public .bia-public__nav-cta:hover { background: var(--bp-accent); color: var(--bp-accent-fg); }

/* member page */
.bia-public__breadcrumb { font-size: .9rem; color: var(--bp-muted); margin-bottom: 1rem; }
.bia-public__breadcrumb a { color: inherit; }
.bia-public__business-header { display: flex; gap: 1.25rem; align-items: center; flex-wrap: wrap; margin-bottom: 1.5rem; }
.bia-public__business-logo { width: 120px; height: 120px; object-fit: contain; border: 1px solid var(--bp-line); border-radius: var(--bp-radius); background: #fff; padding: .4rem; }
.bia-public__legal-name { margin: 0; color: var(--bp-muted); font-size: .95rem; }
.bia-public__category { display: inline-flex; align-items: center; gap: .4rem; margin: .4rem 0 0; padding: .2rem .7rem; border-radius: 999px; background: var(--bp-card); border: 1px solid var(--bp-line); font-size: .9rem; }
.bia-public__category img { width: 18px; height: 18px; }
.bia-public__section { margin-bottom: 1.75rem; }
.bia-public__description { white-space: pre-line; }
.bia-public__details dl { display: grid; grid-template-columns: max-content 1fr; gap: .5rem 1.25rem; margin: 0; }
.bia-public__details dt { font-weight: 600; color: var(--bp-muted); }
.bia-public__details dd { margin: 0; }
.bia-public__social { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: .75rem; }
.bia-public__social a { display: inline-flex; align-items: center; gap: .4rem; text-decoration: none; padding: .35rem .7rem; border: 1px solid var(--bp-line); border-radius: 999px; color: inherit; }
.bia-public__social img { width: 20px; height: 20px; }
.bia-public__back { margin-top: 2rem; }

/* footer */
.bia-public__footer { max-width: var(--bp-max); margin: 0 auto; padding: 1rem; border-top: 1px solid var(--bp-line); color: var(--bp-muted); font-size: .85rem; text-align: center; }

@media (max-width: 520px) {
	.bia-public__details dl { grid-template-columns: 1fr; gap: .15rem; }
	.bia-public__details dt { margin-top: .6rem; }
	.bia-public__business-header { flex-direction: column; align-items: flex-start; }
}