/* CGP-specific sections */

/* Cost of chaos */
.cost__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.25rem; margin-top: 2.5rem; }
.cost__item { background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.75rem; }
.cost__mark { font-family: var(--font-display); font-weight: 700; font-size: 1.1rem; color: var(--lime); letter-spacing: .1em; }
.cost__item h3 { margin: .6rem 0; }
.cost__item p { color: var(--muted); }
@media (max-width: 820px) { .cost__grid { grid-template-columns: 1fr; } }

/* The fix bridge */
.fix { background: var(--surface-2); border-block: 1px solid var(--line); text-align: center; }
.fix__inner { max-width: 820px; }
.fix__lede { color: var(--muted); font-size: clamp(1.1rem, 1.6vw, 1.4rem); margin-top: 1.25rem; }

/* Capabilities: 6-up on wide screens */
.build__grid--six { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 980px) { .build__grid--six { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) { .build__grid--six { grid-template-columns: 1fr; } }

/* Built for every role */
.roles__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.25rem; margin-top: 2.5rem; }
.roles__card { background: var(--surface-2); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.75rem; }
.roles__card--accent { border-color: var(--lime); background: linear-gradient(160deg, rgba(198,255,58,.08), var(--surface-2)); }
.roles__tag { display: inline-block; font-family: var(--font-display); font-weight: 600; font-size: var(--fs-small); letter-spacing: .08em; text-transform: uppercase; color: var(--lime); margin-bottom: .75rem; }
.roles__card p { color: var(--muted); }
@media (max-width: 820px) { .roles__grid { grid-template-columns: 1fr; } }

/* Proof / Orbit */
.proof__inner { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.proof__copy p { color: var(--muted); margin-top: 1rem; max-width: 520px; }
.proof__visual .app-window { box-shadow: 0 40px 90px rgba(0,0,0,.55); }
@media (max-width: 860px) { .proof__inner { grid-template-columns: 1fr; } }

/* The close */
.close { background: linear-gradient(180deg, var(--ink), #0f1410); text-align: center; }
.close__inner { max-width: 760px; }
.close__lede { color: var(--muted); font-size: clamp(1.15rem, 1.7vw, 1.5rem); margin-top: 1.25rem; }
.close__sig { font-family: var(--font-display); letter-spacing: .04em; margin-top: 2.5rem; }