/* Page sections: stats, services, journey, signal flow, copy risk, rules, FAQ, contact. */

/* stats */
.stats-band { border-top: 1px solid var(--border); background: var(--bg2); }
.stats { display: grid; grid-template-columns: repeat(3, 1fr); }
.stat { display: flex; align-items: center; gap: 18px; padding: 28px 24px; border-left: 1px solid var(--border); }
.stat:first-child { border-left: 0; padding-left: 0; }
.stat b { font: 600 52px/1 'Oswald', sans-serif; color: var(--gold); min-width: 48px; text-align: center; }
.stat span { color: var(--soft); font-size: 15px; line-height: 1.45; }
@media (max-width: 760px) { .stats { grid-template-columns: 1fr; } .stat { border-left: 0; border-top: 1px solid var(--border); padding-left: 0; } .stat:first-child { border-top: 0; } }

/* services */
.group { margin-top: 56px; }
.group:first-of-type { margin-top: 0; }
.group-title { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 8px 24px; padding-bottom: 16px; margin-bottom: 24px; border-bottom: 1px solid var(--border); }
.group-title h3 { font-size: 28px; text-transform: uppercase; }
.group-title p { color: var(--muted); font-size: 15px; }
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; }
.cards.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 760px) { .cards.two { grid-template-columns: minmax(0, 1fr); } }
.card { display: flex; flex-direction: column; gap: 16px; padding: 28px; background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); }
.card:hover { border-color: rgba(224, 182, 70, .45); }
.card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.tile { width: 52px; height: 52px; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: var(--green-dk); color: var(--gold); font-size: 24px; flex: none; }
.tags { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.tag { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--border); color: var(--muted); white-space: nowrap; }
.tag.live { background: var(--gold); border-color: var(--gold); color: #1a1505; }
.tag.build { border-color: rgba(224, 182, 70, .5); color: var(--gold); }
.card h3 { font-size: 28px; }
.card .lead { color: var(--soft); }
.checks { display: flex; flex-direction: column; gap: 10px; padding-top: 4px; }
.checks li { position: relative; padding-left: 28px; font-size: 15.5px; line-height: 1.5; color: var(--soft); }
.checks li::before { content: ""; position: absolute; left: 2px; top: 7px; width: 12px; height: 7px; border-left: 2px solid var(--gold); border-bottom: 2px solid var(--gold); transform: rotate(-45deg); }
.ladder { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.rung { padding: 12px; border-radius: 10px; border: 1px solid var(--border); background: var(--bg3); }
.rung b { display: block; font: 500 17px 'Oswald', sans-serif; color: var(--text); }
.rung span { font-size: 12.5px; line-height: 1.4; color: var(--muted); }
.rung.first { border-color: var(--gold); }
.rung.first b { color: var(--gold); }
@media (max-width: 480px) {
  .ladder { grid-template-columns: 1fr; }
  .rung { display: grid; grid-template-columns: 104px 1fr; align-items: baseline; gap: 10px; }
  .rung span { font-size: 13.5px; }
}

/* journey */
.journey { display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; position: relative; }
.journey::before { content: ""; position: absolute; left: 10%; right: 10%; top: 27px; height: 1px; background: rgba(224, 182, 70, .35); }
.jstep { position: relative; display: flex; flex-direction: column; gap: 10px; }
.jstep .no { width: 56px; height: 56px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--bg); border: 1px solid var(--gold); color: var(--gold); font: 600 24px 'Oswald', sans-serif; margin-bottom: 6px; }
.jstep p { color: var(--muted); font-size: 15px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.chip { font-size: 13px; font-weight: 600; padding: 5px 10px; border-radius: 8px; background: var(--bg3); border: 1px solid var(--border); color: var(--soft); }
.chip.ext { background: transparent; border-style: dashed; color: var(--muted); }
.callout { margin-top: 40px; padding: 22px 26px; border-left: 3px solid var(--gold); background: var(--bg3); border-radius: 0 var(--radius) var(--radius) 0; color: var(--soft); }
@media (max-width: 960px) {
  .journey { grid-template-columns: 1fr; gap: 0; }
  .journey::before { left: 27px; right: auto; top: 28px; bottom: 28px; width: 1px; height: auto; }
  .jstep { display: grid; grid-template-columns: 56px 1fr; column-gap: 20px; padding-bottom: 28px; }
  .jstep .no { grid-row: span 3; margin: 0; }
}