/* Account-Based Marketing AI (redesign): the account map. The account at the centre; its buying group around it,
   joined by lines. The ribbon crosses behind the map diagonally (a large transition), never behind text. */
.abm-hero{padding-bottom:var(--s9)}
.abm{margin-top:var(--s8);display:grid;gap:var(--s5)}
.abm-accs{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.abm-accs .illus{margin-left:auto}
.abm-accs button{display:grid;text-align:left;padding:12px 18px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line);transition:box-shadow .25s ease}
.abm-accs b{font-size:16px;color:var(--ink)}.abm-accs small{font-size:14px;color:var(--text)}
.abm-accs [aria-pressed=true]{box-shadow:inset 0 0 0 2px var(--cobalt),var(--sh-ui)}
.abm-map{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) minmax(0,1fr);grid-template-areas:"tech acc com" ". exec .";gap:56px 56px;align-items:center}
.acc{grid-area:acc;box-shadow:0 0 0 2px var(--cobalt),var(--sh-lift)}
.acc-b{padding:20px 24px 24px;display:grid;gap:10px}
.abm-prio{font-size:20px;line-height:1.35;font-weight:800;letter-spacing:-.012em;color:var(--ink);margin-bottom:8px}
#abm-sigs{display:grid;gap:10px}
#abm-sigs li{display:grid;gap:4px;padding:12px 14px;border-radius:12px;background:#F7FAFF;font-size:15.5px;line-height:1.5;color:var(--text)}
#abm-sigs b{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:16px;color:var(--ink)}
.tg{flex:none;font-size:13px;font-weight:800;padding:3px 10px;border-radius:6px}
.tg-verified{background:#E3F7F4;color:var(--t-teal)}.tg-inferred{background:rgba(255,198,90,.12);box-shadow:inset 0 0 0 1px rgba(255,198,90,.42);color:var(--t-amber)}
.rl{position:relative;padding:22px 24px;display:grid;gap:12px}
.rl-tech{grid-area:tech}.rl-com{grid-area:com}.rl-exec{grid-area:exec}
/* lines joining each role to the account */
.rl::after{content:"";position:absolute;background:var(--cobalt)}
.rl-tech::after{top:50%;right:-56px;width:56px;height:2px}
.rl-com::after{top:50%;left:-56px;width:56px;height:2px}
.rl-exec::after{left:50%;top:-56px;width:2px;height:56px}
.rl header{display:grid;gap:4px}
.rl-tier{font-size:14px;font-weight:700;color:var(--deep)}
.rl-who{font-size:20px;letter-spacing:-.012em;color:var(--ink)}
.rl dl{display:grid}
.rl dl div{padding:10px 0;border-top:1px solid var(--line)}
.rl dt{font-size:14px;font-weight:700;color:var(--text)}
.rl dd{margin-top:3px;font-size:16px;line-height:1.5;color:var(--ink)}
.abm-note{font-size:15px;color:var(--text);max-width:52em}

/* the three tiers */
.abm-tiers-in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--s7) var(--s9);align-items:center}
.abm-tiers-copy{display:grid;gap:var(--s5)}
.abm-src{font-size:15px;color:var(--text)}.abm-src a{color:var(--deep);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.tiers{display:grid;gap:12px}
.tiers li{display:grid;gap:6px;padding:22px 26px;border-radius:var(--r-ui);background:#fff;box-shadow:var(--sh-ui)}
.tiers li.t1{margin-right:24%}.tiers li.t2{margin-right:12%}
.tiers b{font-size:20px;letter-spacing:-.012em;color:var(--ink)}
.tiers span{font-size:16px;line-height:1.5;color:var(--text)}
.tiers b{display:flex;align-items:center;gap:10px}.tiers b::before{content:"";width:12px;height:12px;border-radius:50%;background:var(--cobalt)}
.tiers .t2 b::before{background:var(--ma-cyan)}.tiers .t3 b::before{background:var(--ma-coral)}

@media (max-width:1100px){
  .abm-map{grid-template-columns:1fr;grid-template-areas:"acc" "tech" "com" "exec";gap:16px}
  .rl::after{display:none}
  .abm-tiers-in{grid-template-columns:1fr}
}
@media (max-width:760px){.abm-accs .illus{margin-left:0}.tiers li.t1,.tiers li.t2{margin-right:0}.acc-b,.rl{padding:18px}}
