:root {
  --bb-slate:#0F172A;--bb-sand:#F3E8D7;--bb-petrol:#0F766E;--bb-coral:#F97316;--bb-ghost:#FFFFFF;
  --bb-radius: 12px;
  --bb-radius-sm: 8px;
  --bb-gap: 1rem;
  --bb-font: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  --bb-head: Poppins, Montserrat, var(--bb-font);
}
* { box-sizing: border-box; }
html, body { margin:0; padding:0; background: var(--bb-sand); color: var(--bb-slate); font-family: var(--bb-font); line-height:1.5;}
a { color: var(--bb-petrol); text-decoration: none; }
a:hover { text-decoration: underline; }
header { display:flex; align-items:center; justify-content:space-between; padding: 1rem 1.25rem; background:#fff; border-bottom:1px solid #e8e2d8; position:sticky; top:0; z-index:10;}
.logo { display:flex; gap:.75rem; align-items:center; }
.logo span { font-family: var(--bb-head); font-weight: 700; font-size: 1.25rem; }
nav a { margin-left: 1rem; font-weight:600; }
.hero { display:grid; grid-template-columns: 1fr; gap:1rem; padding: clamp(2rem, 6vw, 4rem) 1.25rem; background:linear-gradient(180deg, #fff, var(--bb-sand)); }
.hero h1 { font-family: var(--bb-head); font-size: clamp(1.8rem, 4vw, 3rem); margin:0 0 .5rem 0; }
.hero p { max-width: 60ch; margin:0 0 1rem 0; }
.cta { display:flex; gap:.75rem; flex-wrap:wrap; }
.btn { display:inline-block; padding:.75rem 1rem; border-radius: var(--bb-radius); font-weight:700; border:2px solid transparent; }
.btn-primary { background: var(--bb-coral); color:#fff; }
.btn-primary:hover { filter: brightness(0.95); }
.btn-secondary { background:#fff; border-color:#e8e2d8; }
.section { padding: 2rem 1.25rem; }
.h2 { font-family: var(--bb-head); font-size: 1.5rem; margin:0 0 1rem 0; }
.grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(240px,1fr)); gap: var(--bb-gap); }
.card { background:#fff; border:1px solid #e8e2d8; border-radius: var(--bb-radius); padding:1rem; }
.card h3 { margin:.25rem 0 .25rem 0; font-size:1.1rem; }
.card small { color:#475569; }
.badge { display:inline-block; padding:.15rem .5rem; border-radius:999px; background: #eaf3f1; color: var(--bb-petrol); font-size:.75rem; font-weight:700; }
.affbox { background:#fff; border:1px dashed #e8e2d8; border-radius: var(--bb-radius); padding:1rem; }
.affbox h3 { margin:.25rem 0 .5rem 0; }
.affbox .tag { font-size:.8rem; font-weight:700; color:#7c2d12; background:#ffedd5; border-radius:999px; padding:.1rem .5rem; }
.affbox ul { list-style:none; padding:0; margin:0; display:grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap:.75rem; }
.affbox li a { display:block; background:#fff; border:1px solid #eae3d9; border-radius: var(--bb-radius-sm); padding:.5rem .75rem; }
footer { padding:2rem 1.25rem; border-top:1px solid #e8e2d8; background:#fff; }
footer nav a { margin-right:1rem; }
.kicker { color:#475569; font-weight:700; text-transform:uppercase; letter-spacing:.06em; font-size:.8rem; }
.transparency { margin-top:1rem; background:#fff; border-left:4px solid var(--bb-petrol); padding:1rem; border-radius: var(--bb-radius-sm); }
.search { max-width:720px; display:flex; gap:.5rem; }
.search input { flex:1; padding:.75rem; border:1px solid #e8e2d8; border-radius: var(--bb-radius-sm); }
.taglist { display:flex; flex-wrap:wrap; gap:.5rem; }
footer .legal { margin-top:.75rem; font-size:.9rem; color:#475569; }