/* Pricing (2026-11-04). The signature is the rate card: one printed card with three perforated stubs along its top edge,
   one per founding seat, turned over on its long axis (in held frames) to show what is included. Shared pieces: page.css. */

.pr-split { display: grid; grid-template-columns: minmax(280px, 5fr) 7fr; gap: clamp(28px, 5vw, 110px); align-items: start; }
.pr-prose { display: grid; gap: 1em; font-size: clamp(1.05rem, .98rem + .25vw, 1.25rem); line-height: 1.55; color: var(--ink-2); max-width: 46rem; }
.ink .pr-prose { color: var(--deep-2); }
.inl { color: inherit; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: currentColor; }

/* ---------- the rate card ---------- */
.pr-rates__grid { display: grid; grid-template-columns: minmax(280px, 4fr) 8fr; gap: clamp(28px, 4vw, 90px); align-items: center; }
.rate { position: relative; perspective: 2200px; padding-top: 46px; }
.rate__stubs { position: absolute; top: 0; left: clamp(26px, 3vw, 56px); display: flex; gap: 10px; z-index: 0; }
.rate__stubs i { display: grid; place-items: center; width: clamp(70px, 6vw, 104px); height: 56px; padding-bottom: 8px; font: 600 .82rem/1 var(--sans); font-style: normal; letter-spacing: .14em; color: var(--ink-red);
  background: var(--ivory) var(--sheet-a); background-size: 600px; transform: rotate(var(--t, -1deg)); box-shadow: var(--edge), 2px 4px 8px -4px rgb(18 27 30 / .3);
  -webkit-mask: radial-gradient(circle 4px at 50% 100%, transparent 98%, #000) 0 0 / 14px 100% repeat-x; mask: radial-gradient(circle 4px at 50% 100%, transparent 98%, #000) 0 0 / 14px 100% repeat-x; }
.rate__stubs i:nth-child(2) { --t: 1.2deg; }
.rate__stubs i:nth-child(3) { --t: -.4deg; }
.rate__inner { position: relative; z-index: 1; display: grid; transform-style: preserve-3d; transition: transform .8s steps(10, end); }
.rate.is-over .rate__inner { transform: rotateX(180deg); }
.rate__face { position: relative; grid-area: 1 / 1; backface-visibility: hidden; -webkit-backface-visibility: hidden; background: var(--ivory) var(--sheet-a); background-size: 800px; border-radius: 2px;
  box-shadow: var(--edge), 0 2px 3px rgb(21 31 34 / .16), 12px 26px 44px -20px rgb(13 22 25 / .55); padding: clamp(28px, 3vw, 56px) clamp(28px, 3.4vw, 64px); }
/* the perforation the stubs tear from */
.rate__face::before { content: ""; position: absolute; left: 14px; right: 14px; top: 10px; border-top: 2px dotted rgb(23 29 31 / .25); }
.rate__front { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 3vw, 64px); }
.rate__col + .rate__col { padding-left: clamp(24px, 3vw, 64px); border-left: 1px solid var(--rule); }
.rate__name { font: 600 clamp(1.25rem, 1rem + .6vw, 1.7rem)/1.1 var(--display); color: var(--ink-red); }
.rate__fig { margin: clamp(16px, 2.6svh, 26px) 0 clamp(14px, 2.2svh, 22px); display: grid; gap: 6px; font-size: 1.05rem; color: var(--ink-2); }
.rate__fig strong { font: 600 clamp(2.4rem, 1.4rem + 2.6vw, 4.4rem)/1 var(--display); color: #14191B; letter-spacing: -.02em; margin-right: .18em; }
.rate__row { display: flex; align-items: baseline; flex-wrap: wrap; }
.rate__terms { font-size: 1.02rem; line-height: 1.5; color: var(--ink-2); max-width: 26rem; }
.rate__back { transform: rotateX(180deg); }
.rate__inc { font: 600 clamp(1.2rem, 1rem + .5vw, 1.6rem)/1.2 var(--display); margin-bottom: clamp(14px, 2.4svh, 24px); }
.rate__list { grid-template-columns: 1fr 1fr; column-gap: clamp(24px, 3vw, 56px); }
/* the turn tab: a folded corner, bottom right */
.rate__turn { position: absolute; z-index: 3; right: -10px; bottom: -14px; width: 56px; height: 56px; border: 0; border-radius: 50%; cursor: pointer; color: var(--ivory);
  background: #234048 var(--deep-tex); background-size: 300px; box-shadow: 0 2px 3px rgb(13 22 25 / .35), 0 10px 18px -6px rgb(13 22 25 / .45); display: grid; place-items: center; transition: transform .3s steps(3, end); }
.rate__turn svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.rate__turn:hover { transform: rotate(-30deg); }
.rate__turn:focus-visible { outline: 2px solid var(--ink); outline-offset: 4px; }
.pr-note { left: clamp(50px, 5vw, 96px); top: calc(100% + 22px); }

/* ---------- the rest ---------- */
.pr-two { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 5vw, 110px); }
.pr-two > div { display: grid; gap: .9em; align-content: start; font-size: 1.08rem; line-height: 1.55; color: var(--ink-2); }
.pr-two > div + div { padding-left: clamp(28px, 5vw, 110px); border-left: 1px solid var(--rule); margin-left: calc(-1 * clamp(28px, 5vw, 110px) / 2); }
.pr-h { font-size: clamp(1.6rem, 1.1rem + 1.1vw, 2.5rem); line-height: 1.05; color: #14191B; margin-bottom: .2em; max-width: 18ch; }
.pr-faq__grid { display: grid; grid-template-columns: minmax(260px, 4fr) 8fr; gap: clamp(28px, 4vw, 90px); align-items: start; }
.pr-faq__list > div { padding: clamp(16px, 2.6svh, 26px) 0; border-top: 1px solid var(--rule); }
.pr-faq__list > div:last-child { border-bottom: 1px solid var(--rule); }
.pr-faq__list dt { font: 600 clamp(1.2rem, 1rem + .45vw, 1.55rem)/1.2 var(--display); color: #14191B; }
.pr-faq__list dd { margin: 8px 0 0; font-size: 1.05rem; line-height: 1.55; color: var(--ink-2); max-width: 54rem; }
.pr-close { overflow: hidden; }
.pr-close__inner { position: relative; z-index: 2; }
.pr-close__title { font-size: clamp(2.6rem, 1.3rem + 3vw, min(5.2rem, 10svh)); line-height: .98; color: #14191B; }
.pr-close__text { margin-top: clamp(14px, 2.4svh, 22px); font-size: clamp(1.05rem, .98rem + .25vw, 1.25rem); line-height: 1.55; color: var(--ink-2); max-width: 44rem; }
.pr-close__act { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; margin-top: clamp(22px, 3.6svh, 36px); }
.pr-close__fine { font: italic 1rem var(--serif); color: var(--ink-2); }

@media (max-width: 1100px) {
  .pr-split, .pr-rates__grid, .pr-faq__grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .rate__front { grid-template-columns: 1fr; }
  .rate__col + .rate__col { padding-left: 0; border-left: 0; padding-top: 22px; border-top: 1px solid var(--rule); }
  .rate__list { grid-template-columns: 1fr; }
  .rate__stubs i { width: 64px; }
  .pr-note { display: none; }
  .pr-two { grid-template-columns: 1fr; }
  .pr-two > div + div { padding-left: 0; border-left: 0; margin-left: 0; padding-top: 28px; border-top: 1px solid var(--rule); }
}
@media (prefers-reduced-motion: reduce) { .rate__inner { transition: none; } }