/* AT WHAT COST: the pricing page, on the sky. */
.cost { padding-bottom: 12vh; }
.c-head { padding: 4vh 0 6vh; }
.c-eyebrow { margin: 0 0 14px; color: var(--ink-3); font-size: 0.85rem; font-weight: 650; letter-spacing: 0.1em; text-transform: uppercase; }
.c-head .lede { max-width: 60ch; margin-top: 22px; }
.c-plans { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; align-items: start; }
.plan { display: grid; gap: 14px; padding: 34px 32px 36px; border-radius: 26px; border: 1px solid var(--glass-rim); background: var(--glass-fill); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), var(--glass-shadow); backdrop-filter: blur(18px) saturate(160%); -webkit-backdrop-filter: blur(18px) saturate(160%); }
.plan h2 { margin: 0; font: 650 1.5rem/1.1 var(--display); letter-spacing: -0.02em; }
.price { display: flex; align-items: baseline; gap: 10px; margin: 0; }
.price b { font: 700 3.6rem/1 var(--display); letter-spacing: -0.04em; }
.price span { color: var(--ink-3); font-size: 0.95rem; }
.plan-line { margin: 0; color: var(--ink-2); }
.plan .btn { justify-self: start; }
.ticks { display: grid; gap: 10px; margin: 8px 0 0; padding: 18px 0 0; border-top: 1px solid var(--hair); list-style: none; }
.ticks li { position: relative; padding-left: 28px; color: var(--ink-2); line-height: 1.4; }
.ticks li::before { content: ""; position: absolute; left: 2px; top: 0.35em; width: 14px; height: 8px; border-left: 2px solid var(--cobalt); border-bottom: 2px solid var(--cobalt); transform: rotate(-45deg); }
/* Pro: matte black, silver */
.plan-pro { background: rgba(14, 14, 18, 0.88); border-color: rgba(255, 255, 255, 0.12); color: #f5f5f7; box-shadow: 0 30px 80px -24px rgba(8, 10, 30, 0.6); }
.plan-pro h2, .plan-pro .price b { color: #f5f5f7; }
.plan-pro .price span, .plan-pro .plan-line, .plan-pro .ticks li { color: #c7c7cc; }
.plan-pro .ticks { border-top-color: rgba(255, 255, 255, 0.12); }
.plan-pro .ticks li::before { border-color: #e5e5ea; }
.plan-tag { justify-self: start; margin: 0; padding: 3px 11px; border-radius: 999px; background: linear-gradient(180deg, #f5f5f7, #9a9aa2); color: #111; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.btn-light { background: #f5f5f7; color: #111; box-shadow: none; }
.btn-light:hover { background: #fff; }
.plan-terms { display: grid; gap: 10px; margin-top: 8px; padding: 16px 18px; border-radius: 16px; background: rgba(255, 255, 255, 0.06); font-size: 0.88rem; line-height: 1.5; color: #c7c7cc; }
.plan-terms p { margin: 0; }
.plan-terms b { color: #f5f5f7; }
.c-why, .c-teams { padding-top: 14vh; }
.why-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px 5vw; margin-top: 5vh; }
.why-grid b { font: 650 1.3rem/1.2 var(--display); letter-spacing: -0.02em; color: var(--ink); }
.why-grid p { margin: 8px 0 0; color: var(--ink-2); }
.c-teams { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 5vw; }
.teams-list { display: grid; gap: 22px; margin: 0; padding: 0; list-style: none; color: var(--ink-2); font-size: 1.05rem; line-height: 1.5; }
.teams-list b { color: var(--ink); }
.c-close { padding-top: 16vh; text-align: center; }
.c-close .cta-row { justify-content: center; margin-top: 28px; }
html[data-sky="night"] .ticks li::before { border-color: var(--link); }
@media (max-width: 860px) {
  .c-plans, .why-grid, .c-teams { grid-template-columns: 1fr; }
}
