/* Brand Profile — Shared Styles (v1) */

/* Verdict colour tokens — driven by data-verdict on <main> */
[data-verdict="recommended"] { --vcol:#5ba672; --vcol-deep:#3a6b4a; --vcol-lite:#f2f8f4; }
[data-verdict="acceptable"]  { --vcol:#d9a03a; --vcol-deep:#7a5c10; --vcol-lite:#faf5ea; }
[data-verdict="flagged"]     { --vcol:var(--accent); --vcol-deep:var(--accent-deep); --vcol-lite:#faf0ed; }
[data-theme="dark"] [data-verdict="recommended"] { --vcol-deep:#a7d2a9; --vcol-lite:rgba(91,166,114,.12); }
[data-theme="dark"] [data-verdict="acceptable"]  { --vcol-deep:#e0c377; --vcol-lite:rgba(217,160,58,.1); }
[data-theme="dark"] [data-verdict="flagged"]     { --vcol-deep:var(--accent); --vcol-lite:rgba(var(--accent),.1); }

.bp-hero { padding:var(--s-9) 0 var(--s-7); border-bottom:1px solid var(--line); }

.bp-crumbs {
  display:flex; align-items:center; gap:6px;
  font-family:var(--font-mono); font-size:12.5px;
  color:var(--ink-muted); letter-spacing:.02em;
  margin-bottom:var(--s-5); flex-wrap:wrap;
}
.bp-crumbs a { color:var(--ink-muted); text-decoration:none; }
.bp-crumbs a:hover { color:var(--accent); }
.bp-crumbs .sep { opacity:.4; }

.bp-head {
  display:flex; align-items:flex-start; gap:20px;
}

.bp-logo {
  width:72px; height:72px; border-radius:16px;
  background:#fff; border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
  overflow:hidden; flex-shrink:0;
}
[data-theme="dark"] .bp-logo { background:#f7f3ec; border-color:rgba(255,255,255,.08); }
.bp-logo img { max-width:78%; max-height:78%; object-fit:contain; display:block; }
.bp-logo.is-mono { background:var(--vcol-lite); border-color:var(--line); }
.bp-logo .mono {
  font-family:var(--font-display); font-weight:600;
  font-size:24px; letter-spacing:-.04em; line-height:1;
  color:var(--vcol-deep);
}

.bp-name-block { flex:1; min-width:0; }
.bp-name-row {
  display:flex; align-items:center; gap:10px;
  flex-wrap:wrap; margin-bottom:6px;
}
.bp-name-row h1 {
  font-size:clamp(24px,3.5vw,36px); font-weight:600;
  letter-spacing:-.03em; margin:0; line-height:1.1;
}
.bp-verdict-badge {
  font-family:var(--font-mono); font-size:10px;
  letter-spacing:.1em; text-transform:uppercase;
  padding:4px 10px; border-radius:var(--r-pill);
  border:1px solid; font-weight:500;
  background:color-mix(in oklab,var(--vcol) 14%,var(--bg-elev));
  color:var(--vcol-deep);
  border-color:color-mix(in oklab,var(--vcol) 35%,transparent);
}
.bp-meta {
  font-family:var(--font-mono); font-size:12px;
  color:var(--ink-muted); letter-spacing:.02em;
}

.bp-gauge {
  width:96px; height:96px; position:relative; flex-shrink:0;
}
.bp-gauge svg { width:100%; height:100%; transform:rotate(-90deg); }
.bp-gauge .track { fill:none; stroke:var(--line); stroke-width:6; }
.bp-gauge .fill {
  fill:none; stroke:var(--vcol); stroke-width:6;
  stroke-linecap:round;
}
.bp-gauge-text {
  position:absolute; inset:0;
  display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:1px;
}
.bp-gauge-text .num {
  font-family:var(--font-display); font-size:28px; font-weight:600;
  letter-spacing:-.04em; line-height:1; color:var(--vcol-deep);
  font-variant-numeric:tabular-nums;
}
.bp-gauge-text .out {
  font-family:var(--font-mono); font-size:9px;
  letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink-muted);
}

.bp-content-area { padding:var(--s-7) 0 var(--s-8); max-width:680px; }

.bp-section-title {
  font-family:var(--font-mono); font-size:11px;
  letter-spacing:.1em; text-transform:uppercase;
  color:var(--ink-muted); margin-bottom:var(--s-4);
  padding-bottom:var(--s-3); border-bottom:1px solid var(--line);
}

.bp-dims {
  display:grid; grid-template-columns:1fr 1fr;
  gap:10px 24px; margin-bottom:var(--s-6);
}
.bp-dim { display:flex; align-items:center; gap:10px; }
.bp-dim-label {
  font-family:var(--font-mono); font-size:10px;
  letter-spacing:.06em; text-transform:uppercase;
  color:var(--ink-muted); width:70px; flex-shrink:0; font-weight:500;
}
.bp-dim-bar {
  flex:1; height:5px; background:var(--line);
  border-radius:3px; overflow:hidden;
}
.bp-dim-fill { height:100%; background:var(--vcol); border-radius:3px; }
.bp-dim-val {
  font-family:var(--font-mono); font-size:12px;
  color:var(--ink-soft); width:16px; text-align:right;
  flex-shrink:0; font-weight:500; font-variant-numeric:tabular-nums;
}

.bp-checks {
  display:flex; gap:16px; padding:16px 18px;
  background:var(--surface); border-radius:12px;
  border:1px solid var(--line); margin-bottom:var(--s-6);
}
.bp-check {
  flex:1; display:flex; flex-direction:column;
  align-items:center; gap:6px; text-align:center;
}
.bp-check-ico {
  width:28px; height:28px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:13px; font-weight:700; color:#fff;
}
.bp-check-ico.yes { background:var(--vcol); }
.bp-check-ico.no { background:#c4b8a8; opacity:.75; }
[data-theme="dark"] .bp-check-ico.no { background:#6a635a; }
.bp-check-lbl {
  font-family:var(--font-mono); font-size:10px;
  letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink-muted); font-weight:500;
}

.bp-testing-note {
  font-size:13px; color:var(--ink-soft);
  font-family:var(--font-mono); letter-spacing:.005em;
  background:var(--surface);
  border-left:3px solid var(--vcol);
  padding:12px 14px; border-radius:0 8px 8px 0;
  line-height:1.6; margin-bottom:var(--s-6);
}

.bp-flags { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:var(--s-6); }
.bp-flag {
  display:inline-flex; align-items:center; gap:5px;
  font-family:var(--font-mono); font-size:10.5px;
  letter-spacing:.04em; padding:4px 10px;
  border-radius:var(--r-pill); border:1px solid; font-weight:500;
}
.bp-flag::before {
  content:""; width:5px; height:5px; border-radius:50%;
  background:currentColor; opacity:.7;
}
.bp-flag.neutral { background:var(--surface); color:var(--ink-muted); border-color:var(--line); }
.bp-flag.warn { background:color-mix(in oklab,#d9a03a 14%,var(--bg-elev)); color:#7a5c10; border-color:color-mix(in oklab,#d9a03a 30%,transparent); }
.bp-flag.danger { background:color-mix(in oklab,var(--accent) 12%,var(--bg-elev)); color:var(--accent-deep); border-color:color-mix(in oklab,var(--accent) 30%,transparent); }
[data-theme="dark"] .bp-flag.warn { color:#e0c377; }
[data-theme="dark"] .bp-flag.danger { color:var(--accent); }
.bp-no-flags {
  font-family:var(--font-mono); font-size:11px;
  color:#3a6b4a; letter-spacing:.04em;
  display:inline-flex; align-items:center; gap:6px;
}
.bp-no-flags::before {
  content:""; width:7px; height:7px; border-radius:50%; background:#5ba672;
}
[data-theme="dark"] .bp-no-flags { color:#a7d2a9; }

.bp-reviews { display:flex; flex-direction:column; gap:8px; margin-bottom:var(--s-6); }
.bp-review-item {
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 14px;
  background:var(--bg-elev); border:1px solid var(--line);
  border-radius:10px; text-decoration:none;
  transition:border-color .15s,transform .08s;
}
.bp-review-item:hover { border-color:var(--accent); transform:translateX(2px); }
.bp-review-name { font-size:14px; color:var(--ink); font-weight:500; }
.bp-review-arrow { font-family:var(--font-mono); font-size:12px; color:var(--accent); }

.bp-products { display:flex; flex-direction:column; gap:8px; margin-bottom:var(--s-6); }
.bp-prod {
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; padding:10px 14px;
  background:var(--surface); border:1px solid var(--line);
  border-radius:10px; transition:border-color .15s;
}
.bp-prod:hover { border-color:var(--line-strong); }
.bp-prod-left { flex:1; min-width:0; }
.bp-prod-name {
  font-size:13.5px; color:var(--ink); font-weight:500;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  margin-bottom:2px;
}
.bp-prod-sub {
  font-family:var(--font-mono); font-size:10.5px;
  color:var(--ink-muted); letter-spacing:.02em;
}
.bp-prod-right { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.bp-prod-price {
  font-family:var(--font-display); font-weight:600; font-size:14px;
  color:var(--ink); letter-spacing:-.015em;
}
.bp-prod-link {
  display:inline-flex; align-items:center; gap:4px;
  padding:6px 12px; background:var(--ink); color:var(--bg);
  border-radius:var(--r-pill);
  font-size:10.5px; font-family:var(--font-mono);
  text-decoration:none; letter-spacing:.04em; font-weight:500;
  white-space:nowrap; transition:background .15s;
}
.bp-prod-link:hover { background:var(--accent); }

.bp-summary {
  font-size:15px; line-height:1.7;
  color:var(--ink-soft); margin-bottom:var(--s-7);
  max-width:60ch;
}

.bp-back {
  display:inline-flex; align-items:center; gap:6px;
  font-family:var(--font-mono); font-size:12px;
  color:var(--accent); text-decoration:none;
  letter-spacing:.04em; padding:var(--s-5) 0;
  border-top:1px solid var(--line); margin-bottom:var(--s-8);
  transition:gap .15s;
}
.bp-back:hover { gap:10px; }

.bp-disclosure {
  font-size:12px; color:var(--ink-muted);
  font-family:var(--font-mono); letter-spacing:.01em;
  border-top:1px solid var(--line); padding-top:var(--s-4);
  margin-bottom:var(--s-6); line-height:1.5;
}
.bp-disclosure a { color:var(--accent); }

@media (max-width:700px) {
  .bp-head { flex-direction:column; gap:12px; }
  .bp-gauge { align-self:center; }
  .bp-dims { grid-template-columns:1fr; }
  .bp-checks { flex-direction:column; gap:12px; }
  .bp-prod { flex-direction:column; align-items:flex-start; gap:8px; }
  .bp-prod-right { width:100%; justify-content:space-between; }
}
