/* CF7Bank additions to the shared product-page layout. */
.cf-page .bb-hero { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 40px; }
.cf-page h1 { font-size: clamp(44px, 5.1vw, 78px); }
.cf-inbox { min-width: 0; border: 1px solid var(--ink); background: #e4e7df; }
.cf-inbox-meta, .cf-inbox-footer { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; padding: 16px 18px; font: 9px/1.7 var(--mono); }
.cf-inbox-meta { border-bottom: 1px solid var(--ink); }
.cf-inbox-body { padding: 25px; background: var(--acid); }
.cf-inbox-heading { display: flex; align-items: center; gap: 18px; margin-bottom: 26px; font-size: clamp(24px, 2.5vw, 38px); font-weight: 600; line-height: 1.05; letter-spacing: -1.3px; }
.cf-inbox-heading svg { width: 43px; height: 53px; flex-shrink: 0; }
.cf-record { display: grid; gap: 12px; padding: 18px 0; border-top: 1px solid #191a1740; font: 9px/1.6 var(--mono); }
.cf-record > span:last-child { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 8px; }
.cf-record svg { width: 18px; height: 18px; }
.cf-inbox-footer { border-top: 1px solid var(--ink); font-size: 8px; }
.cf-plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--ink); }
.cf-plan { min-width: 0; padding: 30px; }
.cf-plan:nth-child(2) { background: var(--acid); }
.cf-plan h3 { font-size: clamp(25px, 2.8vw, 38px); overflow-wrap: anywhere; }
.cf-plan > .cf-price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px; color: var(--ink); }
.cf-price strong { font-size: 46px; font-weight: 500; line-height: 1; letter-spacing: -2px; }
.cf-price span { font: 10px/1.6 var(--mono); }
.cf-plan .button { gap: 12px; }
@media(prefers-reduced-motion:no-preference) {
  .cf-inbox { animation: enter .7s .15s ease-out backwards; }
  .cf-record { animation: enter .5s .3s ease-out backwards; }
  .cf-record:nth-child(3) { animation-delay: .45s; }
  .cf-record:nth-child(4) { animation-delay: .6s; }
}
@media(max-width:1000px) { .cf-page .bb-hero { grid-template-columns: minmax(0, 1fr); } .cf-inbox { max-width: 680px; width: 100%; } .cf-plan { padding: 24px 20px; } }
@media(max-width:760px) { .cf-plans { grid-template-columns: minmax(0, 1fr); } .cf-plan + .cf-plan { border-left: 0; border-top: 1px solid var(--ink); } .cf-plan h3 { font-size: 34px; } .cf-page h1 { font-size: clamp(40px, 7.8vw, 58px); } .cf-inbox-body { padding: 22px; } }
