/* ═══════════════════════════════════════════════════════════
   bb-mam.css  —  /meta-ads-management/ ONLY
   Load order: globals > additional > pillar > cro > gam > mam
   Inherits from bb-gam.css: waste-grid, diag-grid, ai-line, dark-roi,
   roi-badge, report, foundation, vert-card, leak-tag, white/light scaffold,
   server-dec-block, pricing flex fix, includes-line.
   Inherits from bb-cro.css: roi-grid, pricing-grid.
   NEW here only:
     1. bb-mam-myth        (S5 belief rebuild)
     2. bb-mam-attrib      (S7 Pixel vs CAPI panel)
     3. bb-mam-trust-row   (S10 trust chips)
     4. bb-mam misc        (operator line, reassure, belief line, usecase)
     5. bb-flow-track--5   (S9 5-phase spacing)
═══════════════════════════════════════════════════════════ */


/* ── 1. S5 BELIEF REBUILD (myth vs reality) ───────────────── */
.bb-mam-myth-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin: 32px 0;
}
.bb-mam-myth-card {
  background: #ffffff;
  border: 1px solid #E8EBF0;
  border-radius: 14px;
  padding: 26px 24px;
  box-shadow: 0 1px 3px rgba(16,24,40,0.04);
}
.bb-mam-myth-line {
  display: block;
  font-size: 0.95rem;
  font-weight: 600;
  color: #9CA3AF;
  text-decoration: line-through;
  text-decoration-color: rgba(237,75,0,0.5);
  text-decoration-thickness: 2px;
  margin-bottom: 14px;
  line-height: 1.4;
}
.bb-mam-myth-truth {
  font-size: 0.9rem !important;
  color: #4F5B68 !important;
  line-height: 1.65 !important;
  margin: 0 !important;
}
.bb-mam-myth-truth strong { color: #111827 !important; }
.bb-mam-belief-line {
  text-align: center;
  max-width: 720px;
  margin: 36px auto 0 !important;
  font-size: 1.15rem !important;
  line-height: 1.5 !important;
  color: #111827 !important;
}
.bb-mam-belief-line strong { color: #111827 !important; }
@media (max-width: 860px) { .bb-mam-myth-grid { grid-template-columns: 1fr; } }


/* ── 2. S7 PIXEL vs CAPI ATTRIBUTION PANEL ────────────────── */
.bb-mam-attrib {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: stretch;
  gap: 0;
  margin: 32px 0 0;
}
.bb-mam-attrib-panel {
  border-radius: 14px;
  padding: 28px 26px;
}
.bb-mam-attrib-panel--before {
  background: #F3F4F6;
  border: 1px solid #E2E5EA;
}
.bb-mam-attrib-panel--after {
  background: #fff8f2;
  border: 1px solid rgba(255,106,0,0.3);
  box-shadow: 0 8px 24px rgba(255,106,0,0.08);
}
.bb-mam-attrib-head {
  display: block;
  font-size: 1.05rem;
  font-weight: 800;
  letter-spacing: -0.01em;
}
.bb-mam-attrib-panel--before .bb-mam-attrib-head { color: #6b7280; }
.bb-mam-attrib-panel--after .bb-mam-attrib-head { color: #FF6A00; }
.bb-mam-attrib-sub {
  display: block;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin: 4px 0 16px;
}
.bb-mam-attrib-panel--before .bb-mam-attrib-sub { color: #9CA3AF; }
.bb-mam-attrib-panel--after .bb-mam-attrib-sub { color: rgba(255,106,0,0.7); }
.bb-mam-attrib-list { list-style: none; margin: 0; padding: 0; }
.bb-mam-attrib-list li {
  position: relative;
  padding-left: 20px;
  font-size: 0.86rem;
  line-height: 1.55;
  margin-bottom: 12px;
}
.bb-mam-attrib-list li:last-child { margin-bottom: 0; }
.bb-mam-attrib-panel--before .bb-mam-attrib-list li { color: #6F757E; }
.bb-mam-attrib-panel--after .bb-mam-attrib-list li { color: #374151; }
.bb-mam-attrib-list li::before {
  content: "";
  position: absolute;
  left: 0; top: 8px;
  width: 7px; height: 7px;
  border-radius: 50%;
}
.bb-mam-attrib-panel--before .bb-mam-attrib-list li::before { background: #C2C6CD; }
.bb-mam-attrib-panel--after .bb-mam-attrib-list li::before { background: #FF6A00; }
.bb-mam-attrib-panel--after .bb-mam-attrib-list li strong { color: #111827; }
.bb-mam-attrib-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 18px;
}
@media (max-width: 760px) {
  .bb-mam-attrib { grid-template-columns: 1fr; gap: 0; }
  .bb-mam-attrib-arrow { padding: 14px 0; transform: rotate(90deg); }
}


/* ── 3. S10 TRUST ROW ─────────────────────────────────────── */
.bb-mam-trust-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}
.bb-mam-trust-item {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: rgba(255,255,255,0.82);
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 999px;
  padding: 6px 14px;
}
.bb-mam-reassure {
  font-size: 0.82rem !important;
  color: rgba(255,255,255,0.7) !important;
  text-align: center;
  margin: 14px 0 0 !important;
}
.bb-mam-reassure strong { color: rgba(255,255,255,0.92) !important; }


/* ── 4. MISC: operator line, usecase cards ────────────────── */
.bb-mam-operator {
  max-width: 760px;
  margin: 0 0 24px !important;
  font-size: 0.92rem !important;
  color: #4F5B68 !important;
  line-height: 1.6 !important;
  padding: 14px 18px;
  background: #F7F8FA;
  border-left: 3px solid #FF6A00;
  border-radius: 0 8px 8px 0;
}
.bb-mam-operator strong { color: #111827 !important; font-weight: 600 !important; }
/* Use-case cards are non-clickable (no link element); remove hover lift cue */
.bb-mam-usecase-card { cursor: default; }
.bb-mam-usecase-card:hover { transform: none; border-color: #E8EBF0; }


/* ── 5. S9 FLOW-TRACK 5-PHASE SPACING ─────────────────────── */
.bb-flow-track--5 { grid-template-columns: repeat(5, 1fr) !important; }
@media (max-width: 1000px) { .bb-flow-track--5 { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 560px) { .bb-flow-track--5 { grid-template-columns: 1fr !important; } }