/* solutions.css — inherits site theme; override per-page if needed */
@import url("styles.css");

/* ---- Solutions page (larger content cards) ---- */
.sol-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-top: 22px;
}
.int-card.sol-card { padding: 26px; }
.sol-card { position: relative; overflow: hidden; }
.sol-card::after { content: ""; position: absolute; inset: auto -80px -100px auto; width: 190px; height: 190px; border-radius: 50%; background: rgba(17,17,17,.12); pointer-events: none; }
.sol-card h3 { font-size: clamp(1.25rem, 1.05rem + .9vw, 1.6rem); margin: 6px 0 8px; }
.sol-sub { color: var(--muted); font-weight: 700; margin: 0 0 12px; }
.sol-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.sol-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 16px; }
.sol-list { list-style: none; padding: 0; margin: 0; }
.sol-list li { position: relative; padding-left: 16px; margin: 6px 0; }
.sol-list li::before { content: "•"; position: absolute; left: 0; color: var(--accent); font-weight: 800; }
.sol-cta { margin-top: 12px; }
.solution-paths { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.solution-path { position: relative; overflow: hidden; min-height: 210px; padding: 26px; border: 1px solid rgba(17,17,17,.11); border-radius: 22px; background: rgba(255,255,255,.72); box-shadow: var(--shadow-soft); }
.solution-path span { display: block; margin-bottom: 46px; color: #4d4d4d; font-size: .72rem; font-weight: 850; letter-spacing: .13em; }
.solution-path h3 { margin: 0 0 8px; font-size: 1.35rem; letter-spacing: -.035em; }
.solution-path p { margin: 0; color: var(--muted); }
.solution-path::after { content: ""; position: absolute; top: -44px; right: -44px; width: 120px; height: 120px; border: 1px solid rgba(17,17,17,.18); border-radius: 50%; box-shadow: 0 0 0 18px rgba(17,17,17,.04); }
.devs.integrations { padding-top: 84px; }

@media (max-width: 1024px) {
  .sol-grid { grid-template-columns: 1fr; }
  .sol-columns { grid-template-columns: 1fr; }
  .solution-paths { grid-template-columns: 1fr; }
  .solution-path { min-height: auto; }
}