/* Credit packs use the established paper and ink palette. */
.cp{color:var(--ink);font-family:var(--font-sans);font-size:15px;line-height:1.5;min-width:0}.cp p{margin:0}.cp-head{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:20px}.cp-head h2{margin:6px 0 10px}.cp-head>div:first-child{max-width:620px}.cp-currency{display:flex;border:1px solid var(--hairline);border-radius:12px;padding:4px;flex-shrink:0;gap:4px}.cp-currency button{min-height:44px;min-width:64px;padding:8px 14px;border:0;border-radius:8px;background:transparent;color:var(--ink);font:inherit;font-weight:600;cursor:pointer}.cp-currency button[aria-pressed=true]{background:#0b1830;color:#fff}.cp-notice{color:#663e13;background:#fff3d9;padding:12px 16px;border-radius:10px;font-weight:600;margin-bottom:20px!important}.cp-incentives,.cp-depths{display:grid;gap:16px;margin:20px 0}.cp-incentives{grid-template-columns:1fr 1fr}.cp-incentives p{background:#f0edf7;border-radius:12px;padding:18px}.cp-incentives b,.cp-incentives span,.cp-depths b,.cp-depths span{display:block}.cp-depths{grid-template-columns:repeat(3,1fr);border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);padding:16px 0}.cp-tax{max-width:850px;margin-bottom:24px!important;color:var(--ink-2)}.cp-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.cp-card{border:1px solid var(--hairline);border-radius:16px;padding:20px 16px;display:flex;flex-direction:column;gap:16px;background:var(--surface,#fff);min-width:0}.cp-card h3{font-size:20px;font-weight:600;margin:0}.cp-card header>span{display:block;font-size:13px;color:var(--ink-2)}.cp-price{font-family:var(--font-mono);font-size:28px;letter-spacing:-.04em;overflow-wrap:anywhere;line-height:1.2}.cp-price small{display:block;font-family:var(--font-sans);font-size:12px;letter-spacing:0;margin-top:8px;color:var(--ink-2)}.cp-credits b{font-size:28px}.cp-unit,.cp-afford{font-size:13px;color:var(--ink-2)}.cp-costs{margin:0;border-top:1px solid var(--hairline);padding-top:12px}.cp-costs div{display:flex;justify-content:space-between;gap:8px;margin:6px 0}.cp-costs dd{margin:0;font-variant-numeric:tabular-nums}.cp-card .btn{margin-top:auto;min-height:44px;white-space:normal;text-align:center}.cp-figure{margin:32px 0;padding:24px;border-radius:16px;background:#f0edf7}.cp-figure figcaption b,.cp-figure figcaption span{display:block}.cp-figure figcaption span{color:var(--ink-2);font-size:13px;margin:6px 0 20px}.cp-bars{display:grid;gap:12px}.cp-bar{display:grid;grid-template-columns:64px 1fr 48px;gap:12px;align-items:center}.cp-bar>div{height:16px;background:#ded8ed;border-radius:4px}.cp-foot{color:var(--ink-2);margin-top:16px!important}.cp-foot a,.cp a:not(.btn),[data-credit-offer] a{color:#4b3a77;text-decoration:underline;text-underline-offset:3px}.cp-checkout{display:block!important;max-width:1120px;margin:auto;padding:32px 24px}.cp-checkout .focus-head{max-width:680px}.cp-landing{padding-top:64px;padding-bottom:64px}.cp-offer{color:var(--ink);background:var(--paper,#fff);padding:24px;border-radius:16px;margin:24px 0}.cp-offer p{margin:0}.cp-offer .cp-depths{margin-bottom:20px}
@media(max-width:1100px){.cp-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:760px){.cp-head{display:block}.cp-currency{width:max-content;margin-top:20px}.cp-cards{grid-template-columns:1fr}.cp-incentives{grid-template-columns:1fr}.cp-depths{gap:8px;font-size:13px}.cp-card{padding:24px}.cp-price{font-size:28px}.cp-figure{padding:20px}.cp-checkout{padding:24px 20px}.cp-incentives span{margin-top:6px}.cp-offer{padding:20px}}

.cp-bar-svg{display:block;width:100%;height:16px;fill:#65548f}.cp-selection{color:var(--ink);padding:16px;background:#f0edf7;border-radius:12px;margin-bottom:24px}

.cp-offer a{display:inline-block;min-height:44px;padding:10px 0}.cp-offer details summary{min-height:44px;padding:12px 0;cursor:pointer}

.cp-checkout{background:#faf9f5;border-radius:20px;--ink:#141413;--ink-2:#4e4a44;--ink-3:#67635b;--paper:#faf9f5;--surface:#fffefa;color:#141413}.cp-checkout .focus-head{text-align:left}.cp-checkout .focus-head .af-sub{color:#4e4a44}

.cp-checkout{position:relative;z-index:2}

.cp-landing{position:relative;z-index:2;background:#faf9f5;border-radius:20px;padding-left:24px;padding-right:24px}

/* =====================================================================================================
   Founder review 10-09 · C8: the credit offer and the credit-pack FAQ (help, signup, onboarding, verify-email, home) use
   the public content patterns. The section stays in the page column: the old "margin: 24px 0" cancelled .container's auto
   margins and pinned the block to the left wall at every width above the page column.
   ===================================================================================================== */
.container.cp-offer { margin-left: auto; margin-right: auto; }
body.pi .container.cp-offer { margin-top: 0; margin-bottom: clamp(48px, 5vw, 80px); padding-top: 0; padding-bottom: 0; background: none; border-radius: 0; }
.cp-offer { font-family: var(--font-sans); }
.cp-offer .cp-notice { display: flex; align-items: center; gap: 10px; width: fit-content; max-width: 100%; padding: 7px 14px 7px 12px; border-radius: var(--r-pill); background: var(--warning-tint); color: var(--warning); font-size: var(--fs-small); font-weight: 600; line-height: 1.4; margin: 0 0 20px !important; }
.cp-offer .cp-notice::before { content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--brand-orange); box-shadow: 0 0 0 3px rgba(225,145,54,.22); }
.cp-offer .cp-incentives { gap: 16px; margin: 0 0 8px; }
.cp-offer .cp-incentives p { position: relative; min-height: 96px; padding: 22px 24px 22px 80px; background: var(--raised); border: 1px solid var(--hairline); border-radius: var(--r-lg); box-shadow: 0 1px 2px rgba(20,20,19,.04); }
.cp-offer .cp-incentives p::before { content: ""; position: absolute; left: 22px; top: 22px; width: 40px; height: 40px; border-radius: 12px; border: 1px solid transparent;
  background: linear-gradient(var(--raised), var(--surface)) padding-box, linear-gradient(135deg, rgba(18,117,216,.42), rgba(20,20,19,.08) 50%, rgba(225,145,54,.5)) border-box; box-shadow: 0 6px 14px -10px rgba(11,24,48,.35); }
.cp-offer .cp-incentives p::after { content: ""; position: absolute; left: 32px; top: 32px; width: 20px; height: 20px; background: var(--accent-ink); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='18' height='4' rx='1'/%3E%3Cpath d='M12 8v13M19 12v7a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2v-7M7.5 8a2.5 2.5 0 0 1 0-5A4.8 8 0 0 1 12 8a4.8 8 0 0 1 4.5-5 2.5 2.5 0 0 1 0 5'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='18' height='4' rx='1'/%3E%3Cpath d='M12 8v13M19 12v7a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2v-7M7.5 8a2.5 2.5 0 0 1 0-5A4.8 8 0 0 1 12 8a4.8 8 0 0 1 4.5-5 2.5 2.5 0 0 1 0 5'/%3E%3C/svg%3E") center / contain no-repeat; }
.cp-offer .cp-incentives p + p::after { background: var(--brand-orange-deep); -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.94 15.5A2 2 0 0 0 8.5 14.06l-6.14-1.58a.5.5 0 0 1 0-.96L8.5 9.94A2 2 0 0 0 9.94 8.5l1.58-6.14a.5.5 0 0 1 .96 0l1.58 6.14a2 2 0 0 0 1.44 1.44l6.14 1.58a.5.5 0 0 1 0 .96l-6.14 1.58a2 2 0 0 0-1.44 1.44l-1.58 6.14a.5.5 0 0 1-.96 0z'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.94 15.5A2 2 0 0 0 8.5 14.06l-6.14-1.58a.5.5 0 0 1 0-.96L8.5 9.94A2 2 0 0 0 9.94 8.5l1.58-6.14a.5.5 0 0 1 .96 0l1.58 6.14a2 2 0 0 0 1.44 1.44l6.14 1.58a.5.5 0 0 1 0 .96l-6.14 1.58a2 2 0 0 0-1.44 1.44l-1.58 6.14a.5.5 0 0 1-.96 0z'/%3E%3C/svg%3E"); }
.cp-offer .cp-incentives b { margin-bottom: 6px; font-size: var(--fs-row); font-weight: 600; line-height: var(--lh-row); color: var(--ink); }
.cp-offer .cp-incentives span { font-size: var(--fs-desc); line-height: var(--lh-desc); color: var(--ink-2); }
.cp-offer .cp-incentives span + span { margin-top: 8px; color: var(--ink); font-variant-numeric: tabular-nums; }
.cp-offer .cp-depths { margin: 8px 0 12px; padding: 0; gap: 0; border: 0; }
.cp-offer .cp-depths p { padding: 16px 20px 14px 0; border-top: 1px solid var(--hairline-strong); }
.cp-offer .cp-depths p + p { padding-left: 20px; border-left: 1px solid var(--hairline); }
.cp-offer .cp-depths b { font-size: var(--fs-ui); font-weight: 600; color: var(--ink); }
.cp-offer .cp-depths span { margin-top: 2px; font-size: var(--fs-small); color: var(--ink-2); font-variant-numeric: tabular-nums; }
.cp-offer > p > a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0; font-size: var(--fs-ui); font-weight: 500; color: var(--accent-ink); text-decoration: none; }
.cp-offer > p > a::after { content: ""; width: 16px; height: 16px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M12 5l7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M12 5l7 7-7 7'/%3E%3C/svg%3E") center / contain no-repeat; transition: transform var(--d-3) var(--ease-out); }
.cp-offer > p > a:hover::after { transform: translateX(3px); }
/* Credit-pack FAQ: the help page's accordion rows (hairline rows, plus → cross). */
.cp-offer > h2 { margin-bottom: 20px; font-family: var(--font-brand); font-weight: 500; font-size: var(--fs-section); line-height: var(--lh-section); letter-spacing: var(--ls-title); color: var(--ink); }
.cp-offer details { border-bottom: 1px solid var(--hairline); }
.cp-offer h2 + details { border-top: 1px solid var(--hairline); }
.cp-offer details summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 64px; padding: 12px 4px; list-style: none; font-size: var(--fs-row); font-weight: 500; color: var(--ink); border-radius: var(--r-sm); }
.cp-offer details summary::-webkit-details-marker { display: none; }
.cp-offer details summary::after { content: ""; flex: none; width: 32px; height: 32px; border-radius: 50%; background: var(--sunken) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M12 5v14'/%3E%3C/svg%3E") center / 16px no-repeat; transition: transform var(--d-4) var(--ease-out), background-color var(--d-3); }
.cp-offer details summary:hover::after { background-color: var(--sunken-2); }
.cp-offer details[open] summary::after { transform: rotate(45deg); }
.cp-offer details > :not(summary) { max-width: 66ch; padding: 0 4px 22px; font-size: var(--fs-body); line-height: var(--lh-body); color: var(--ink-2); }
@media (max-width: 760px) {
  .cp-offer .cp-incentives p { padding: 18px 18px 18px 70px; }
  .cp-offer .cp-incentives p::before { left: 16px; top: 18px; }
  .cp-offer .cp-incentives p::after { left: 26px; top: 28px; }
  .cp-offer .cp-depths p { padding-right: 10px; }
  .cp-offer .cp-depths p + p { padding-left: 12px; }
}
