/* ============================================================
   Solution-page shared components (Sales / Finance / Customer Success)
   Loaded on top of site.css. The "capability spine" (S4) is the
   reusable centerpiece — Finance & CS swap content, not layout.
   ============================================================ */

.hero.sol-hero { min-height:auto; padding-top:130px; padding-bottom:5rem; }
.badge-row { display:flex; gap:.6rem; flex-wrap:wrap; margin:1.5rem 0 0; }

/* persona cards */
.persona-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.5rem; margin-top:3rem; }
.persona-card { background:var(--card-bg); border:1px solid var(--card-border); border-radius:16px; padding:1.8rem; transition:all .3s; }
.persona-card:hover { border-color:var(--slate-mid); transform:translateY(-3px); }
.persona-card .p-role { display:flex; align-items:center; gap:.7rem; font-family:'Poppins',sans-serif; font-weight:800; font-size:1.15rem; margin-bottom:.3rem; }
.persona-card .p-role .p-ic { width:40px;height:40px;border-radius:10px;background:rgba(47,141,254,.14);display:flex;align-items:center;justify-content:center;font-size:1.15rem; }
.persona-card .p-pain { color:var(--text-muted); font-size:.95rem; font-style:italic; margin-bottom:.9rem; line-height:1.5; }
.persona-card .p-promise { color:var(--text-primary); font-size:1rem; line-height:1.6; margin-bottom:1rem; }
.persona-card .p-backed { font-size:.78rem; color:var(--text-secondary); border-top:1px solid var(--card-border); padding-top:.8rem; }
.persona-card .p-backed b { color:var(--cyan); font-weight:600; font-family:'Roboto', sans-serif; font-size:.72rem; }
@media (max-width:820px){ .persona-grid { grid-template-columns:1fr; } }

/* before/after */
.ba-grid { display:grid; grid-template-columns:1fr auto 1fr; gap:1.5rem; align-items:stretch; margin-top:3rem; }
.ba-col { border-radius:16px; padding:1.8rem; }
.ba-before { background:rgba(255,0,131,.06); border:1px solid rgba(255,0,131,.2); }
.ba-after { background:rgba(45,164,147,.06); border:1px solid rgba(45,164,147,.2); }
.ba-col h4 { font-family:'Roboto', sans-serif; font-size:.75rem; letter-spacing:.12em; text-transform:uppercase; margin-bottom:1rem; }
.ba-before h4 { color:var(--rose); } .ba-after h4 { color:var(--emerald); }
.ba-col ul { list-style:none; }
.ba-col li { font-size:.95rem; color:var(--text-secondary); padding:.5rem 0 .5rem 1.6rem; position:relative; line-height:1.5; border-bottom:1px solid var(--card-border); }
.ba-col li:last-child { border-bottom:none; }
.ba-before li::before { content:'✗'; position:absolute; left:0; color:var(--rose); }
.ba-after li::before { content:'✓'; position:absolute; left:0; color:var(--emerald); }
.ba-arrow { display:flex; align-items:center; justify-content:center; font-size:1.6rem; color:var(--snap-blue); }
.ba-tot { font-family:'Poppins',sans-serif; font-weight:800; margin-top:1rem; font-size:1rem; }
.ba-before .ba-tot { color:var(--rose); } .ba-after .ba-tot { color:var(--emerald); }
@media (max-width:820px){ .ba-grid { grid-template-columns:1fr; } .ba-arrow { transform:rotate(90deg); } }

/* deal-cycle / lifecycle spine */
.spine { margin-top:3rem; display:flex; flex-direction:column; gap:0; }
.spine-stage { display:grid; grid-template-columns:180px 1fr; gap:2rem; padding:2rem 0; border-top:1px solid var(--card-border); position:relative; }
.spine-stage:last-child { border-bottom:1px solid var(--card-border); }
.spine-left { position:relative; }
.spine-k { font-family:'Roboto', sans-serif; font-size:.72rem; color:var(--cyan); letter-spacing:.1em; }
.spine-stage h3 { font-family:'Poppins',sans-serif; font-size:1.4rem; font-weight:800; margin-top:.3rem; letter-spacing:-.02em; }
.spine-right p { color:var(--text-secondary); font-size:1rem; line-height:1.7; margin-bottom:1rem; }
.spine-right p .skill { color:var(--text-primary); font-weight:600; }
.spine-meta { display:flex; flex-wrap:wrap; gap:.9rem; }
.spine-skills, .spine-conns { display:flex; flex-wrap:wrap; gap:.4rem; align-items:center; }
.spine-conns .lbl, .spine-skills .lbl { font-size:.68rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:.08em; margin-right:.2rem; }
@media (max-width:720px){ .spine-stage { grid-template-columns:1fr; gap:.8rem; } }

/* proof automations */
.auto-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; margin-top:2.5rem; }
.auto-card { background:var(--card-bg); border:1px solid var(--card-border); border-radius:12px; padding:1.4rem; }
.auto-card .a-cron { font-family:'Roboto', sans-serif; font-size:.7rem; color:var(--cyan); }
.auto-card h4 { font-family:'Poppins',sans-serif; font-size:1rem; margin:.5rem 0; }
.auto-card p { font-size:.95rem; color:var(--text-secondary); line-height:1.55; margin-bottom:.9rem; }
.auto-card .a-runs { font-family:'Poppins',sans-serif; font-weight:800; color:var(--emerald); font-size:1.1rem; }
.auto-card .a-runs span { font-size:.72rem; color:var(--text-muted); font-weight:400; }
@media (max-width:820px){ .auto-grid { grid-template-columns:1fr; } }

/* integrations groups */
.int-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1.2rem; margin-top:3rem; }
.int-group { background:var(--card-bg); border:1px solid var(--card-border); border-radius:12px; padding:1.4rem; }
.int-group h4 { font-family:'Poppins',sans-serif; font-size:.95rem; margin-bottom:.9rem; display:flex; justify-content:space-between; align-items:center; }
.int-group h4 .cnt { font-family:'Roboto', sans-serif; font-size:.68rem; color:var(--text-muted); font-weight:400; }
.int-group .chips { display:flex; flex-wrap:wrap; gap:.4rem; }

/* governance rail */
.gov-rail { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-top:2.5rem; }
.gov-pill { background:var(--card-bg); border:1px solid var(--card-border); border-radius:12px; padding:1.2rem; }
.gov-pill .gi { font-size:1.2rem; } .gov-pill h4 { font-family:'Poppins',sans-serif; font-size:.92rem; margin:.5rem 0 .3rem; } .gov-pill p { font-size:1rem; color:var(--text-secondary); line-height:1.5; }
@media (max-width:820px){ .gov-rail { grid-template-columns:1fr 1fr; } }

/* objection accordion */
.acc { margin-top:2.5rem; max-width:860px; }
.acc details { background:var(--card-bg); border:1px solid var(--card-border); border-radius:12px; margin-bottom:.8rem; overflow:hidden; }
.acc summary { cursor:pointer; padding:1.2rem 1.5rem; font-family:'Poppins',sans-serif; font-weight:700; font-size:1.02rem; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.acc summary::-webkit-details-marker { display:none; }
.acc summary::after { content:'+'; color:var(--snap-blue); font-size:1.4rem; font-weight:400; flex-shrink:0; transition:transform .2s; }
.acc details[open] summary::after { content:'−'; }
.acc details[open] summary { border-bottom:1px solid var(--card-border); }
.acc .acc-body { padding:1.2rem 1.5rem; color:var(--text-secondary); font-size:1rem; line-height:1.75; }
.acc .acc-body strong { color:var(--text-primary); }

/* in-demo approval affordance (HITL action) */
.approve-row { display:flex; gap:.5rem; margin-top:.7rem; flex-wrap:wrap; }
.approve-btn { background:#2eb67d; color:#fff; font-size:.78rem; font-weight:700; padding:.4rem .85rem; border-radius:6px; }
.approve-alt { background:transparent; border:1px solid rgba(255,255,255,.18); color:#D1D2D3; font-size:.78rem; font-weight:600; padding:.4rem .85rem; border-radius:6px; }

/* lateral cross-links */
.lateral { display:flex; gap:1rem; flex-wrap:wrap; justify-content:center; margin-top:1rem; }
.lateral a { background:var(--card-bg); border:1px solid var(--card-border); border-radius:100px; padding:.6rem 1.4rem; text-decoration:none; color:var(--text-secondary); font-size:.9rem; font-weight:600; transition:all .2s; }
.lateral a:hover { border-color:var(--snap-blue); color:var(--text-primary); }