/* =====================================================================
   PRICING (SC-534) - /pricing/
   Uses the product page template (page-category.css) for the title type,
   section headings, buttons and closing call to action. This file adds:
     .pr-hero     the title, then two plan cards (after Stripe's pricing page)
                  over a diagonal band of colour that keeps flowing
     .pr-calc     the price calculator (scripts/page-pricing.js)
     .pr-where    one rule: tabs of what you sell beside each item as it is priced
     .pr-cover    what SideCoach takes care of: one payment followed to the bank
     .pr-faq      questions, title left and accordion right
   ===================================================================== */
.pr-page{--pr-ink:#0d1b2a; --pr-text:#41505d; --pr-muted:#62707c; --pr-line:#e3e8ee; --pr-teal:#007a76;}
.pr-page .pc-sh{font-weight:500;}
.pr-page .pc-sh b{font-weight:500;}
.pr-arr{width:10px; height:10px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round;}
.pr-tick{flex:none; width:16px; height:16px; fill:none; stroke:var(--pr-teal); stroke-width:2; stroke-linecap:round; stroke-linejoin:round;}

/* ---------- hero ---------- */
.pr-hero{position:relative; isolation:isolate; overflow:hidden; padding:clamp(64px,8vw,104px) 0 clamp(72px,8vw,112px); background:#fbfcfd;
  border-bottom:1px solid #edf1f4;}
/* the colour band, after Stripe: a wide diagonal ribbon with crisp edges, its colours flowing along it in one
   seamless loop (two identical colour cycles side by side, slid by exactly one cycle), soft folds drifting
   across it, and only its far ends fading out. Gradient only here in the hero. */
.pr-band{position:absolute; z-index:-1; left:-20%; right:-20%; top:50%; height:min(40%,300px); overflow:hidden; transform:rotate(-9deg);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75), inset 0 -1px 0 rgba(13,27,42,.08), 0 30px 60px -40px rgba(13,27,42,.35);
  -webkit-mask-image:linear-gradient(90deg,transparent 2%,#000 20%,#000 84%,transparent 98%); mask-image:linear-gradient(90deg,transparent 2%,#000 20%,#000 84%,transparent 98%);}
.pr-band i{position:absolute; top:0; bottom:0; left:0; width:200%; will-change:transform;
  background:linear-gradient(90deg,
    #ffb36b 0%, #ff8fa8 7%, #e58cf0 14%, #9d8cff 21%, #5f9bff 28%, #36c2e6 35%, #1fc9b5 42%, #ffb36b 50%,
    #ff8fa8 57%, #e58cf0 64%, #9d8cff 71%, #5f9bff 78%, #36c2e6 85%, #1fc9b5 92%, #ffb36b 100%);}
/* folds: light and shade running across the ribbon */
.pr-band::after{content:""; position:absolute; inset:0; mix-blend-mode:soft-light;
  background:repeating-linear-gradient(100deg, rgba(255,255,255,0) 0, rgba(255,255,255,.38) 70px, rgba(255,255,255,0) 140px, rgba(13,27,42,.10) 210px, rgba(255,255,255,0) 280px);
  background-size:560px 100%;}
@media (prefers-reduced-motion:no-preference){
  .pr-band i{animation:pr-flow 24s linear infinite;}
  .pr-band::after{animation:pr-folds 16s linear infinite;}
}
@keyframes pr-flow{from{transform:translateX(0);} to{transform:translateX(-50%);}}
@keyframes pr-folds{from{background-position:0 0;} to{background-position:560px 0;}}
.pr-hero .pc-title{max-width:14em;}
.pr-lede{max-width:34em; margin:22px 0 0; font-size:clamp(17px,1.5vw,19px); line-height:1.55; color:var(--pr-text);}

.pr-plans{display:grid; grid-template-columns:minmax(0,1.45fr) minmax(0,1fr); gap:20px; margin-top:clamp(40px,5vw,60px);}
.pr-plan{position:relative; border:1px solid rgba(13,27,42,.08); border-radius:16px; background:#fff;
  box-shadow:0 1px 1px rgba(13,27,42,.04), 0 2px 6px rgba(13,27,42,.04), 0 40px 70px -40px rgba(13,27,42,.4);}
.pr-plan h2{margin:0; font-size:22px; font-weight:600; letter-spacing:-.01em; color:var(--pr-ink);}
.pr-plan p{margin:10px 0 0; font-size:15px; line-height:1.5; color:var(--pr-muted);}
.pr-plan-a{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.25fr); overflow:hidden;}
.pr-plan-copy{display:flex; flex-direction:column; align-items:flex-start; padding:28px;}
.pr-plan-copy .pc-btn{margin-top:auto;}
.pr-plan-copy p{margin-bottom:24px;}
.pr-stairs{display:flex; align-items:flex-end; gap:10px; margin:0; padding:28px 28px 22px; list-style:none; background:#f6f9fc; border-left:1px solid #edf1f4;}
.pr-stairs li{flex:1; display:flex; flex-direction:column; align-items:stretch; gap:8px; min-width:0;}
.pr-st-bar{position:relative; display:flex; align-items:flex-start; justify-content:center; height:calc(64px + var(--i) * 40px); padding-top:10px;
  border-radius:8px 8px 3px 3px; background:linear-gradient(180deg, #00a39d, #007a76); box-shadow:0 10px 20px -12px rgba(0,122,118,.6);
  transform-origin:bottom; animation:pr-rise .9s calc(.3s + var(--i) * .12s) cubic-bezier(.2,.8,.2,1) both;}
@keyframes pr-rise{from{transform:scaleY(0);}}
.pr-st-bar b{font-size:clamp(20px,1.9vw,28px); font-weight:300; color:#fff; letter-spacing:-.01em; font-variant-numeric:tabular-nums;}
.pr-stairs small{font-size:12px; font-weight:500; text-align:center; color:var(--pr-text); white-space:nowrap;}

.pr-plan-b{padding:28px; background:#0d2a3a; border-color:#0d2a3a; color:#fff;}
.pr-plan-b h2{color:#fff;}
.pr-zero{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin:22px 0 0; padding:0; list-style:none; border-top:1px solid rgba(255,255,255,.12);}
.pr-zero li{padding:18px 12px 0 0; border-right:1px solid rgba(255,255,255,.12);}
.pr-zero li + li{padding-left:16px;}
.pr-zero li:last-child{border-right:0;}
.pr-zero b{display:block; font-size:clamp(34px,3.2vw,46px); font-weight:300; line-height:1; color:#5fd8d4; letter-spacing:-.02em;}
.pr-zero span{display:block; margin-top:8px; font-size:13px; color:#b9ccd4;}
.pr-plan-b .pr-plan-note{display:flex; gap:10px; align-items:flex-start; margin-top:26px; padding-top:18px; border-top:1px solid rgba(255,255,255,.12); color:#d8e6eb; font-size:14px;}
.pr-plan-b .pr-tick{stroke:#5fd8d4;}

/* ---------- sections ---------- */
.pr-sec{position:relative; isolation:isolate; padding:clamp(72px,9vw,120px) 0;}
.pr-calc-sec{background:#fff;}
.pr-where{background:#f6f9fc; border-top:1px solid #edf1f4; border-bottom:1px solid #edf1f4;}
.pr-cover{background:#fff;}
.pr-faq{background:#f6f9fc; border-top:1px solid #edf1f4;}

/* ---------- calculator ---------- */
.pr-calc-wrap{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:clamp(40px,6vw,96px); align-items:center;}
.pr-notes{display:grid; gap:12px; margin:28px 0 0; padding:0; list-style:none;}
.pr-notes li{display:flex; gap:10px; font-size:15px; line-height:1.5; color:var(--pr-text);}
.pr-calc{position:relative; padding:26px; border:1px solid rgba(13,27,42,.08); border-radius:18px; background:#fff;
  box-shadow:0 1px 1px rgba(13,27,42,.04), 0 40px 80px -44px rgba(13,27,42,.45);}
/* the gradient lives inside the frame */
.pr-calc::before{content:""; position:absolute; z-index:-1; inset:-14px -14px -14px 24px; border-radius:24px;
  background:linear-gradient(135deg,#c6f0ec,#bfe3f7 45%,#d9cffb 80%,#ffd9b8); opacity:.7;}
.pr-mode{display:grid; grid-template-columns:1fr 1fr; gap:4px; padding:4px; border-radius:10px; background:#f1f4f7;}
.pr-mode button{padding:9px 10px; border:0; border-radius:7px; background:none; font:inherit; font-size:13.5px; font-weight:600; color:var(--pr-muted); cursor:pointer;
  transition:background .2s, color .2s, box-shadow .2s;}
.pr-mode button[aria-checked="true"]{background:#fff; color:var(--pr-ink); box-shadow:0 1px 3px rgba(13,27,42,.14);}
.pr-mode button:focus-visible{outline:2px solid var(--pr-teal); outline-offset:2px;}
.pr-in{display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:24px;}
.pr-in-l{font-size:15px; font-weight:600; color:var(--pr-ink);}
.pr-in-f{display:flex; align-items:center; gap:4px; padding:6px 12px; border:1px solid var(--pr-line); border-radius:10px; background:#fff;
  transition:border-color .2s, box-shadow .2s;}
.pr-in-f:focus-within{border-color:var(--pr-teal); box-shadow:0 0 0 3px rgba(0,122,118,.15);}
.pr-in-f i{font-style:normal; font-size:24px; font-weight:300; color:var(--pr-muted);}
.pr-in-f input{width:4.6em; border:0; outline:0; background:none; font:inherit; font-size:28px; font-weight:300; color:var(--pr-ink); text-align:right;
  font-variant-numeric:tabular-nums; -moz-appearance:textfield;}
.pr-in-f input::-webkit-outer-spin-button,.pr-in-f input::-webkit-inner-spin-button{-webkit-appearance:none; margin:0;}
.pr-range{width:100%; margin:18px 0 6px; accent-color:var(--pr-teal);}
.pr-out{margin-top:10px; border-top:1px solid #eef1f4;}
.pr-row{display:flex; justify-content:space-between; align-items:baseline; padding:12px 0; border-bottom:1px solid #f1f3f6; font-size:15px; color:var(--pr-text);}
.pr-row b{font-weight:500; color:var(--pr-ink); font-variant-numeric:tabular-nums;}
.pr-total span{font-weight:600; color:var(--pr-ink);}
.pr-total b{font-size:26px; font-weight:400; color:var(--pr-teal);}
.pr-split{display:flex; height:8px; margin:16px 0 4px; border-radius:8px; overflow:hidden; background:#eef1f4;}
.pr-split i{display:block; height:100%; transition:width .45s cubic-bezier(.2,.8,.2,1);}
.pr-split .r{background:linear-gradient(90deg,#00a39d,#007a76);}
.pr-split .f{background:#ffb27a;}
.pr-warn{margin:12px 0 0; padding:10px 12px; border-radius:10px; background:#fff6ec; font-size:13.5px; line-height:1.45; color:#8a4a12;}
.pr-warn button{padding:0; border:0; background:none; font:inherit; font-weight:700; color:#8a4a12; text-decoration:underline; cursor:pointer;}
.pr-card{display:flex; gap:8px; align-items:center; margin:16px 0 0; font-size:13.5px; color:var(--pr-text);}
.pr-calc.bump .pr-total b{animation:pr-bump .4s ease;}
@keyframes pr-bump{40%{transform:translateY(-3px); color:#00a39d;}}
.pr-total b{display:inline-block;}

/* ---------- one rule: tabs left (only the active one opens, with a fill line), the item's UI right ---------- */
.pr-rule{display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(32px,5vw,72px); align-items:center; margin-top:48px;}
.pr-tabs{margin:0; padding:0; list-style:none; border-top:1px solid #dfe5ea;}
.pr-tab{position:relative; display:block; width:100%; padding:16px 0 16px; border:0; border-bottom:1px solid #dfe5ea; background:none; font:inherit; text-align:left; cursor:pointer;}
.pr-tab b{display:block; font-size:16px; font-weight:600; color:var(--pr-muted); transition:color .25s;}
.pr-tab span{display:block; max-height:0; overflow:hidden; font-size:14.5px; line-height:1.5; color:var(--pr-text); opacity:0; transition:max-height .35s, opacity .35s, margin .35s;}
.pr-tab.on b{color:var(--pr-ink);}
.pr-tab.on span{max-height:60px; margin-top:6px; opacity:1;}
.pr-tab-bar{position:absolute; left:0; bottom:-1px; height:2px; width:0; background:var(--pr-teal);}
.pr-tab.on .pr-tab-bar{width:100%; transition:width var(--pr-dwell,5s) linear;}
.pr-tab.on.hold .pr-tab-bar{transition:none;}
.pr-tab:focus-visible{outline:2px solid var(--pr-teal); outline-offset:2px; border-radius:2px;}
.pr-tab:hover b{color:var(--pr-ink);}

.pr-stage{position:relative; padding:clamp(28px,4vw,48px); border-radius:20px; overflow:hidden;
  background:linear-gradient(135deg,#e9f7f5 0%,#eaf2fd 45%,#f3eefe 80%,#fff3e8 100%);}
.pr-stage::before{content:""; position:absolute; inset:0; background:radial-gradient(rgba(13,27,42,.08) 1px, transparent 1.3px) 0 0/16px 16px;
  -webkit-mask-image:linear-gradient(160deg,transparent 30%,#000); mask-image:linear-gradient(160deg,transparent 30%,#000);}
.pr-ui{position:relative; display:grid; min-height:290px; padding:20px 22px; border:1px solid rgba(13,27,42,.08); border-radius:14px; background:#fff;
  box-shadow:0 1px 1px rgba(13,27,42,.04), 0 30px 60px -34px rgba(13,27,42,.45); font-size:13px; color:var(--pr-ink); font-variant-numeric:tabular-nums;}
.pr-view{grid-area:1 / 1; opacity:0; transform:translateY(8px); visibility:hidden; transition:opacity .35s, transform .35s, visibility 0s .35s;}
.pr-view.on{opacity:1; transform:none; visibility:visible; transition:opacity .35s .05s, transform .35s .05s;}
.pr-ui-h{display:flex; justify-content:space-between; align-items:baseline; padding-bottom:12px; margin-bottom:4px; border-bottom:1px solid #eef1f4;}
.pr-ui-h b{font-size:15px; font-weight:600;}
.pr-ui-h small{font-size:12px; color:var(--pr-muted);}
.pr-li{display:grid; grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,.8fr)); align-items:center; gap:10px; padding:12px 0; border-bottom:1px solid #f1f3f6;}
.pr-li b{display:block; font-weight:600;}
.pr-li small{display:block; font-size:11.5px; color:var(--pr-muted);}
.pr-li > span,.pr-li > strong{text-align:right;}
.pr-li-r{color:var(--pr-text);}
.pr-li-f{justify-self:end; padding:2px 8px; border-radius:6px; background:#fff3e6; color:#9a5412; font-weight:600; font-size:12px;}
.pr-li strong{font-weight:600; font-size:14px; color:var(--pr-teal);}
.pr-li-h{padding:8px 0 6px; font-size:11px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:#8a97a3;}
.pr-li-h span{text-align:right;}
.pr-view.on .pr-li:not(.pr-li-h){animation:pr-line .5s cubic-bezier(.2,.8,.2,1) both;}
.pr-view.on .pr-li:nth-of-type(3){animation-delay:.08s;} .pr-view.on .pr-li:nth-of-type(4){animation-delay:.16s;} .pr-view.on .pr-li:nth-of-type(5){animation-delay:.24s;}
@keyframes pr-line{from{opacity:0; transform:translateX(-8px);}}
.pr-ui-foot{margin:14px 0 0; font-size:13px; color:var(--pr-muted);}
.pr-promo{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:12px; border:1px solid #eef1f4; border-radius:12px; overflow:hidden;}
.pr-promo > div{padding:16px; border-left:1px solid #eef1f4;}
.pr-promo > div:first-child{border-left:0;}
.pr-promo small{display:block; font-size:11.5px; color:var(--pr-muted);}
.pr-promo b{display:block; margin-top:6px; font-size:24px; font-weight:300; letter-spacing:-.01em;}
.pr-promo b.t{color:var(--pr-teal);}
.pr-promo s{display:block; margin-top:6px; font-size:12px; color:#62707c;}
.pr-promo s + b{margin-top:0;}

/* ---------- what SideCoach takes care of: one payment followed to the bank ---------- */
.pr-cover-in{display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(40px,6vw,96px); align-items:center;}
.pr-care{display:grid; gap:0; margin:36px 0 0; padding:0; list-style:none; counter-reset:care;}
.pr-care li{position:relative; display:grid; gap:4px; padding:16px 0 16px 44px; border-top:1px solid #e6ebef; counter-increment:care; transition:opacity .4s;}
.pr-care li::before{content:counter(care, decimal-leading-zero); position:absolute; left:0; top:17px; font-size:13px; font-weight:600; color:#62707c; font-variant-numeric:tabular-nums;}
.pr-care b{font-size:16px; font-weight:600; color:var(--pr-ink);}
.pr-care span{font-size:14.5px; line-height:1.5; color:var(--pr-muted);}
.pr-care li.on::before{color:var(--pr-teal);}

.pr-stmt{position:relative; padding:22px 24px; border:1px solid rgba(13,27,42,.08); border-radius:16px; background:#fff;
  box-shadow:0 1px 1px rgba(13,27,42,.04), 0 40px 80px -44px rgba(13,27,42,.45); font-variant-numeric:tabular-nums;}
.pr-stmt::before{content:""; position:absolute; z-index:-1; inset:24px -20px -20px 40px; border-radius:22px;
  background:linear-gradient(140deg,#c6f0ec,#bfe3f7 50%,#d9cffb); opacity:.6;}
.pr-stmt-h{display:flex; justify-content:space-between; align-items:baseline; padding-bottom:12px; border-bottom:1px solid #eef1f4;}
.pr-stmt-h b{font-size:15px; font-weight:600; color:var(--pr-ink);}
.pr-stmt-h small{font-size:12px; color:var(--pr-muted);}
.pr-w{position:relative; display:flex; justify-content:space-between; align-items:center; gap:16px; padding:14px 0; border-bottom:1px dashed #e3e8ee; font-size:14.5px; color:var(--pr-text);}
.pr-w b{font-weight:500; color:var(--pr-ink);}
.pr-w em{font-style:normal; font-size:13px; font-weight:500; color:var(--pr-teal);}
.pr-w.tot{border-bottom:0;}
.pr-w.tot span{font-weight:600; color:var(--pr-ink);}
.pr-w.tot b{font-size:28px; font-weight:300; color:var(--pr-teal); letter-spacing:-.01em;}
.pr-payout{display:flex; align-items:center; gap:12px; margin-top:8px; padding:14px 16px; border-radius:12px; background:#0d2a3a; color:#fff;}
.pr-payout i{flex:none; width:30px; height:30px; border-radius:8px; background:rgba(95,216,212,.16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235fd8d4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10h18M5 10v8M9 10v8M15 10v8M19 10v8M3 20h18M12 3l9 5H3z'/%3E%3C/svg%3E") center/16px no-repeat;}
.pr-payout div{flex:1;}
.pr-payout b{display:block; font-size:14px; font-weight:600;}
.pr-payout small{display:block; font-size:12px; color:#9fb6c0;}
.pr-payout strong{font-size:18px; font-weight:400; color:#5fd8d4;}
/* the statement fills in, line by line, when it comes into view (scripts/page-pricing.js adds .play) */
.pr-stmt.wait .pr-w,.pr-stmt.wait .pr-payout{opacity:0; transform:translateY(8px);}
.pr-stmt.play .pr-w,.pr-stmt.play .pr-payout{animation:pr-in .55s cubic-bezier(.2,.8,.2,1) both;}
.pr-stmt.play .w1{animation-delay:.45s;} .pr-stmt.play .w2{animation-delay:.9s;} .pr-stmt.play .w3{animation-delay:1.35s;}
.pr-stmt.play .w4{animation-delay:1.8s;} .pr-stmt.play .pr-payout{animation-delay:2.4s;}
@keyframes pr-in{from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:none;}}

/* ---------- FAQ ---------- */
.pr-faq-in{display:grid; grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr); gap:clamp(32px,6vw,96px); align-items:start;}
.pr-qs{border-top:1px solid #dfe5ea;}
.pr-q{border-bottom:1px solid #dfe5ea;}
.pr-q summary{display:flex; justify-content:space-between; align-items:center; gap:20px; padding:20px 0; list-style:none; cursor:pointer;
  font-size:16px; font-weight:600; color:var(--pr-ink);}
.pr-q summary::-webkit-details-marker{display:none;}
.pr-q summary i{position:relative; flex:none; width:22px; height:22px; border-radius:50%; background:#e7f6f5;}
.pr-q summary i::before,.pr-q summary i::after{content:""; position:absolute; left:6px; right:6px; top:10px; height:2px; border-radius:2px; background:var(--pr-teal); transition:transform .25s;}
.pr-q summary i::after{transform:rotate(90deg);}
.pr-q[open] summary i::after{transform:rotate(0);}
.pr-q summary:focus-visible{outline:2px solid var(--pr-teal); outline-offset:4px; border-radius:4px;}
.pr-q p{max-width:44em; margin:-6px 0 20px; font-size:15px; line-height:1.6; color:var(--pr-text);}

/* ---------- smaller screens ---------- */
@media (max-width:1100px){
  .pr-plans{grid-template-columns:1fr;}
}
@media (max-width:900px){
  .pr-calc-wrap,.pr-faq-in{grid-template-columns:1fr;}
  .pr-rule,.pr-cover-in{grid-template-columns:1fr;}
  .pr-band{top:34%; height:240px;}
}
@media (max-width:640px){
  .pr-plan-a{grid-template-columns:1fr;}
  .pr-stairs{order:-1; border-left:0; border-bottom:1px solid #edf1f4; padding:22px 16px 16px; gap:8px;}
  .pr-st-bar{height:calc(48px + var(--i) * 28px);}
  .pr-stairs small{font-size:11px; white-space:normal; line-height:1.25;}
  .pr-plan-copy,.pr-plan-b{padding:22px;}
  .pr-zero b{font-size:32px;}
  .pr-zero li + li{padding-left:12px;}
  .pr-stage{padding:14px; margin:0 -6px;}
  .pr-ui{padding:16px 14px; min-height:270px;}
  .pr-li{grid-template-columns:minmax(0,1.3fr) repeat(3,minmax(0,.8fr)); gap:6px; font-size:12px;}
  .pr-li strong{font-size:13px;}
  .pr-li-f{padding:2px 5px; font-size:11px;}
  .pr-li-h{font-size:9.5px;}
  .pr-promo b{font-size:19px;}
  .pr-promo > div{padding:12px 10px;}
  .pr-stmt{padding:18px 16px;}
  .pr-stmt::before{inset:20px -8px -12px 20px;}
  .pr-w{font-size:13.5px;}
  .pr-w em{font-size:11.5px; padding:3px 8px; text-align:right;}
  .pr-calc{padding:20px;}
  .pr-calc::before{inset:-10px -6px -10px 14px;}
  .pr-mode button{font-size:12.5px; padding:9px 6px;}
  .pr-band{top:26%; height:200px; left:-60%; right:-60%;}
}
@media (prefers-reduced-motion:reduce){
  .pr-page *,.pr-page *::before,.pr-page *::after{animation:none !important; transition:none !important;}
}

/* the hero band, second look (Mehul 2026-10-21: match the payments hero, in our colours): the colour now runs along the
   ribbon as soft blurred streams of brand teal with a glowing aqua core (an SVG from build_pricing.py), lit with a teal
   glow; the old rainbow stripes and folds are off */
.pr-band{box-shadow:inset 0 1px 0 rgba(255,255,255,.55), 0 40px 90px -30px rgba(0,122,118,.45), 0 -20px 80px -40px rgba(33,227,210,.5);}
.pr-band i{display:none;}
.pr-band svg{position:absolute; top:0; left:0; width:200%; height:100%; filter:saturate(1.25) brightness(1.06); will-change:transform;}
.pr-band::after{animation:none !important; mix-blend-mode:normal;
  background:linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,0) 30%, rgba(255,255,255,0) 70%, rgba(13,27,42,.10)); background-size:auto;}
@media (prefers-reduced-motion:no-preference){ .pr-band svg{animation:pr-flow 30s linear infinite;} }

/* ======== pricing redesign (Mehul 2026-10-23): calculator in the hero, a fee ruler with real items, an always-$0 stats
   band, then the payment statement and the FAQ. Light, Stripe-style; the hero band is thinner. ======== */
.pr-band{height:min(26%,190px) !important; top:56% !important;}
@media (max-width:960px){ .pr-band{height:150px !important; top:auto !important; bottom:8%;} }
.pr-hero2 .pr-hero2-in{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.95fr); gap:clamp(32px,5vw,72px); align-items:center;}
.pr-hero2 .pc-title{max-width:12em;}
.pr-hero2 .pr-notes{margin-top:22px;}
.pr-ctas{display:flex; flex-wrap:wrap; gap:12px; margin-top:28px;}
.pr-hero2 .pr-calc{box-shadow:0 0 0 1px rgba(50,50,93,.07), 0 40px 80px -30px rgba(13,40,60,.35), 0 12px 24px -16px rgba(0,0,0,.12) !important;}
.pr-hero2 #calculator{scroll-margin-top:90px;}
@media (max-width:960px){ .pr-hero2 .pr-hero2-in{grid-template-columns:minmax(0,1fr);} }
/* the fee ruler */
.pr-ruler-sec{background:#f6f9fc; border-top:1px solid #eef1f4; border-bottom:1px solid #eef1f4;}
.pr-ruler{position:relative; margin-top:clamp(36px,4vw,52px); padding:28px 28px 22px; border-radius:16px; background:#fff; box-shadow:0 0 0 1px #e6ebef, 0 24px 48px -32px rgba(13,40,60,.25);}
.pr-pins{position:relative; height:150px; margin:0; padding:0; list-style:none;}
.pr-pin{position:absolute; left:var(--x); bottom:0; display:flex; flex-direction:column; align-items:flex-start;}
.pr-pin i{position:absolute; left:0; bottom:0; width:1px; height:30px; background:#9fb3bd;}
.pr-pin i::after{content:""; position:absolute; left:-3px; bottom:-3px; width:7px; height:7px; border-radius:50%; background:#0b1a24;}
.pr-pin.up i{height:88px;}
.pr-pin span{position:absolute; left:-1px; bottom:30px; padding:0 0 6px 10px; border-left:1px solid #9fb3bd; white-space:nowrap;}
.pr-pin.up span{bottom:88px;}
.pr-pin b{display:block; font-size:13px; font-weight:600; color:#0b1a24;}
.pr-pin small{display:block; font-size:11.5px; color:#62707c;}
.pr-pin em{display:inline-block; margin-top:4px; padding:1px 7px; border-radius:999px; background:#e7f5f3; color:#00605d; font-style:normal; font-size:11px; font-weight:700;}
.pr-pin:last-child span{left:auto; right:1px; padding:0 10px 6px 0; border-left:0; border-right:1px solid #9fb3bd; text-align:right;}
.pr-segs{position:relative; height:84px; border-radius:10px; overflow:hidden; background:#f3f6f8;}
.pr-seg{position:absolute; top:0; bottom:0; left:var(--a); width:calc(var(--b) - var(--a)); display:flex; flex-direction:column; justify-content:center; padding:0 16px; border-left:1px solid #fff;}
.pr-seg b{font-size:26px; font-weight:400; letter-spacing:-.02em; line-height:1;}
.pr-seg small{margin-top:5px; font-size:11.5px; font-weight:500;}
.pr-seg.s0{background:#e7f5f3; color:#00605d;} .pr-seg.s1{background:#c5e9e3; color:#00605d;} .pr-seg.s2{background:#5fbfb4; color:#fff;} .pr-seg.s3{background:#007a76; color:#fff;}
.pr-seg.s0{border-left:0;}
.pr-ticks{position:relative; height:22px; margin-top:6px;}
.pr-tk{position:absolute; left:var(--x); transform:translateX(-50%); font-size:11.5px; color:#62707c; font-variant-numeric:tabular-nums;}
.pr-tk:first-child{transform:none;}
.pr-ruler-note{display:flex; gap:8px; align-items:flex-start; max-width:46em; margin:22px 0 0; font-size:15px; line-height:1.55; color:#56677a;}
.pr-ruler-note .pr-tick{flex:none; margin-top:4px;}
@media (max-width:760px){
  .pr-ruler{padding:20px 16px 16px; overflow-x:auto;}
  .pr-pins, .pr-segs, .pr-ticks{min-width:640px;}
}
/* always $0 */
.pr-zero-sec{padding:clamp(48px,6vw,72px) 0 !important;}
.pr-zero2{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin:0; border-top:1px solid #e6ebef; border-bottom:1px solid #e6ebef;}
.pr-zero2 > div{display:flex; flex-direction:column; padding:26px 24px 28px 0;}
.pr-zero2 > div + div{padding-left:24px; border-left:1px solid #e6ebef;}
.pr-zero2 dt{order:2; margin-top:10px; font-size:15px; font-weight:600; color:#0b1a24;}
.pr-zero2 dd{order:1; margin:0; font-size:clamp(44px,4.6vw,60px); font-weight:300; letter-spacing:-.03em; line-height:1; color:#0b1a24;}
.pr-zero2 > div:last-child dd:not(.pr-z-n){color:#007a76;}
.pr-zero2 dd.pr-z-n{order:3; margin-top:3px; font-size:13.5px; font-weight:400; letter-spacing:0; line-height:1.4; color:#62707c;}   /* a dd, not a small: a dl may only hold dt and dd */
@media (max-width:760px){ .pr-zero2{grid-template-columns:1fr 1fr;} .pr-zero2 > div:nth-child(3){padding-left:0; border-left:0;} .pr-zero2 > div:nth-child(n+3){border-top:1px solid #e6ebef;} }
/* no tinted glow cards stacked behind the calculator or the statement; the band sits low, behind the calculator, clear of
   the copy */
.pr-calc::before, .pr-stmt::before{content:none !important;}
.pr-band{top:auto !important; bottom:4% !important;}
.pr-hero2{padding-bottom:clamp(110px,11vw,160px) !important;}
/* ruler pins: one straight line per item. The label's own left edge is the line, running from the dot on the bar up past
   the text, instead of a stem and a separate border that did not quite meet */
.pr-pin i{width:0 !important; height:0 !important; background:none !important;}
.pr-pin span{left:0 !important; bottom:0 !important; padding:0 0 30px 10px !important; border-left:1px solid #9fb3bd !important;}
.pr-pin.up span{padding-bottom:88px !important;}
.pr-pin:last-child span{left:auto !important; right:0 !important; padding:0 10px 30px 0 !important; border-left:0 !important; border-right:1px solid #9fb3bd !important;}
.pr-pin:last-child.up span{padding-bottom:88px !important;}
.pr-pin i::after{left:-3.5px !important;}
.pr-pin:last-child i::after{left:-3.5px !important;}
/* weekly payout row (Mehul 2026-10-23: the dark navy block read as AI): a light row in the statement's own style, a pale
   teal tint with a hairline, ink text and the amount in brand teal */
.pr-payout{background:#f1faf8 !important; box-shadow:inset 0 0 0 1px #d3ece8 !important; color:#0b1a24 !important;}
.pr-payout b{color:#0b1a24 !important;} .pr-payout small{color:#56677a !important;}
.pr-payout strong{color:#007a76 !important;}
.pr-payout i{background-color:#fff !important; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23007a76' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10h18M5 10v8M9.5 10v8M14.5 10v8M19 10v8M3 20h18M12 3l9 5H3z'/%3E%3C/svg%3E") !important; background-repeat:no-repeat !important; background-position:center !important; background-size:16px !important; box-shadow:inset 0 0 0 1px #d3ece8 !important;}
/* always-$0 band, a little closer (Mehul 2026-10-23): the same four equal cells as before, in a narrower frame centred on
   the page, so the numbers sit nearer each other */
@media (min-width:761px){ .pr-zero2{max-width:940px; margin-left:auto; margin-right:auto;} .pr-zero2 > div{padding:24px 24px 26px 0;} .pr-zero2 > div + div{padding-left:28px;} }
.pr-zero-sec{padding:clamp(36px,4.5vw,56px) 0 !important;}

/* sharper corners (Mehul 2026-10-27), same rule as the rest of the site: 8px on large frames, 6px on small cards */
main .pr-calc,main .pr-mode,main .pr-ruler,main .pr-segs,main .pr-stmt,main .pr-payout{border-radius:8px !important;}
main .pr-in-f{border-radius:6px !important;}

/* fee by price, staging bands (Mehul 2026-10-27): about 110 one-dollar steps replace the four bands, so the
   segment bar became a step chart for the first $200, with the add-on fee as a second line and a row of
   sample prices underneath */
.pr-chart{position:relative; height:140px; border-bottom:1px solid #e3e9ee;}
.pr-steps{display:block; width:100%; height:100%; overflow:visible;}
.pr-steps path{vector-effect:non-scaling-stroke;}
.pr-steps .ar{fill:#e7f5f3; stroke:none;}
.pr-steps .rg{fill:none; stroke:#007a76; stroke-width:2;}
.pr-steps .ad{fill:none; stroke:#8fa3ad; stroke-width:1.5; stroke-dasharray:none;}
.pr-key{position:absolute; left:14px; top:10px; display:flex; gap:18px; font-size:12px; color:#56677a;}
.pr-key span{display:inline-flex; align-items:center; gap:7px;}
.pr-key span::before{content:""; width:14px; height:2px; background:#007a76;}
.pr-key span.ad::before{background:#8fa3ad;}
.pr-samples{display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); margin:22px 0 0; border-top:1px solid #eef2f4;}
.pr-samples > div{padding:14px 12px 4px 0;}
.pr-samples > div + div{padding-left:14px; border-left:1px solid #eef2f4;}
.pr-samples dt{font-size:12.5px; color:#62707c;}
.pr-samples dd{margin:4px 0 0; font-size:20px; font-weight:500; letter-spacing:-.01em; color:#0b1a24;}
.pr-samples dd small{display:block; margin-top:2px; font-size:12px; font-weight:400; color:#62707c;}
.pr-samples .h dt,.pr-samples .h dd{font-size:12.5px; font-weight:600; color:#56677a;}
.pr-samples .h dd{margin-top:10px;}
@media (max-width:760px){
  .pr-samples{grid-template-columns:repeat(3,minmax(0,1fr)); row-gap:6px;}
  .pr-samples .h{display:none;}
  .pr-samples > div,.pr-samples > div + div{padding:12px 10px 4px 0; border-left:0;}
  .pr-chart{height:auto; display:flex; flex-direction:column;}
  .pr-steps{height:130px;}
  .pr-key{order:-1; position:static; flex-wrap:wrap; gap:6px 16px; margin-bottom:12px;}
}

/* fee lookup table (Mehul 2026-10-27): the step chart and item pins were hard to read, so the section is a plain
   table of price ranges with the registration and add-on fee, up to $210 open and the rest behind "Show prices" */
.pr-table{padding:8px 28px 18px;}
.pr-free{display:flex; justify-content:space-between; align-items:baseline; padding:16px 0; border-bottom:1px solid #e3e9ee; font-size:15px;}
.pr-free b{font-weight:600;} .pr-free span{color:#00605d; font-weight:600;}
.pr-fees{width:100%; border-collapse:collapse; font-size:15px; font-variant-numeric:tabular-nums;}
.pr-fees thead th{padding:16px 0 10px; font-size:12.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:#62707c; text-align:right;}
.pr-fees thead th:first-child{text-align:left;}
.pr-fees tbody th{padding:12px 0; font-weight:500; text-align:left; color:#0b1a24;}
.pr-fees td{padding:12px 0; text-align:right; color:#0b1a24; font-weight:600; width:24%;}
.pr-fees td + td{color:#56677a; font-weight:500;}
.pr-fees tbody tr{border-top:1px solid #eef2f4;}
.pr-fees tbody tr:hover{background:#f6f9fc;}
.pr-fees-h{margin:22px 0 2px; font-size:15px; font-weight:600; color:#0b1a24;} .pr-fees-h span{display:block; font-size:12.5px; font-weight:500; color:#62707c;}
.pr-fees-note{margin:16px 0 0; font-size:13.5px; line-height:1.5; color:#56677a;}
.pr-more{margin-top:4px; border-top:1px solid #eef2f4;}
.pr-more summary{list-style:none; cursor:pointer; padding:16px 0 4px; font-size:15px; font-weight:600; color:#007a76;}
.pr-more summary::-webkit-details-marker{display:none;}
.pr-more summary::after{content:" +"; font-weight:500;}
.pr-more[open] summary::after{content:" \2212";}
.pr-more .pr-fees{margin-top:8px;}
/* the two schedules are 112 rows each: they scroll inside the card instead of stretching the page */
.pr-fees-scroll{max-height:440px; overflow-y:auto; overscroll-behavior:contain; margin-top:4px; padding-right:14px; border-bottom:1px solid #eef2f4; scrollbar-width:thin; scrollbar-color:#c9d2da transparent;}
.pr-fees-scroll:focus-visible{outline:2px solid var(--pr-teal, #007a76); outline-offset:2px; border-radius:6px;}
.pr-fees-scroll .pr-fees thead th{position:sticky; top:0; z-index:1; background:#fff;}
.pr-sched{margin-top:14px;}
.pr-fees-free th{font-size:17px; font-weight:700;} .pr-fees-free th small{margin-left:6px; font-size:13px; font-weight:500; color:#62707c;}
.pr-sched-tabs{display:flex; gap:22px; border-bottom:1px solid #eef2f4;}
.pr-sched-tabs button{padding:6px 0 10px; border:0; border-bottom:2px solid transparent; margin-bottom:-1px; background:none; font:inherit; font-size:14px; font-weight:600; color:#62707c; cursor:pointer;}
.pr-sched-tabs button:hover{color:#0b1a24;}
.pr-sched-tabs button[aria-selected="true"]{color:#0b1a24; border-bottom-color:var(--pr-teal, #007a76);}
.pr-sched-tabs button:focus-visible{outline:2px solid var(--pr-teal, #007a76); outline-offset:2px; border-radius:4px;}
.pr-sched .pr-fees-h{margin-top:18px;} .pr-sched .pr-fees-h span{max-width:46em; line-height:1.45;}
.pr-sched .pr-fees-scroll{margin-top:6px;}
@media (max-width:640px){
  .pr-table{padding:4px 16px 14px;}
  .pr-fees{font-size:14px;}
  .pr-fees thead th{font-size:11px; letter-spacing:.02em;}
  .pr-fees td{width:26%;}
}
.pr-table{max-width:760px;}

/* Find your fee, the price tape (Mehul 2026-10-27, option B): a $200 window of prices with each fee band
   drawn over its stretch, a draggable marker and quick price chips; the full table sits behind a disclosure */
.pr-tape{max-width:none; padding:32px 36px 26px;}
.pt-read{display:flex; align-items:flex-end; gap:44px;}
.pt-read small{display:block; font-size:12.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:#62707c;}
.pt-read b{display:block; margin-top:4px; font-size:44px; font-weight:500; letter-spacing:-.02em; line-height:1.05; font-variant-numeric:tabular-nums;}
.pt-read .f b{color:#007a76;}
.pt-read .a b{font-size:28px; color:#56677a;}
.pt-hint{margin-left:auto; font-size:13px; color:#62707c;}
.pt-wrap{position:relative; margin-top:44px; touch-action:none; cursor:ew-resize; user-select:none; -webkit-user-select:none;}
.pt-tape{position:relative; height:96px; border-radius:6px; background:#f3f6f8; overflow:hidden;}
.pt-fees{position:absolute; left:0; right:0; top:0; height:40px;}
.pt-fees span{position:absolute; top:0; bottom:0; border-left:1px solid #e1e8ec; padding:12px 0 0; text-align:center; font-size:13px; font-weight:600; color:#56677a; white-space:nowrap; overflow:hidden; transition:background .2s, color .2s;}
.pt-fees span:first-child{border-left:0;}
.pt-fees span.on{background:#d9efec; color:#00605d;}
.pt-nums{position:absolute; left:0; right:0; bottom:30px; height:16px;}
.pt-nums i{position:absolute; transform:translateX(-50%); font-style:normal; font-size:12px; color:#62707c; font-variant-numeric:tabular-nums;}
.pt-nums i:first-child{transform:none; padding-left:8px;}
.pt-nums i:last-child{transform:translateX(-100%); padding-right:8px;}
.pt-ticks{position:absolute; left:0; right:0; bottom:0; height:26px;
  background:linear-gradient(90deg,#8c9ca6 1px,transparent 1px) 0 100%/25% 26px repeat-x,
             linear-gradient(90deg,#b9c6cd 1px,transparent 1px) 0 100%/2.5% 12px repeat-x;}
.pt-marker{position:absolute; top:-8px; bottom:-8px; width:2px; margin-left:-1px; background:#0b1a24; outline:none; transition:left .15s ease-out;}
.pt-marker span{position:absolute; top:-30px; left:50%; transform:translateX(-50%); padding:4px 9px; border-radius:5px; background:#0b1a24; color:#fff; font-size:12.5px; font-weight:600; white-space:nowrap; font-variant-numeric:tabular-nums;}
.pt-marker span::after{content:""; position:absolute; left:50%; bottom:-8px; margin-left:-5px; border:5px solid transparent; border-top-color:#0b1a24;}
.pt-marker:focus-visible span{box-shadow:0 0 0 3px #fff, 0 0 0 5px #007a76;}
.pt-wrap:active .pt-marker{transition:none;}
.pt-quick{display:flex; flex-wrap:wrap; gap:10px; margin-top:24px;}
.pt-quick button{padding:7px 13px; border:0; border-radius:999px; background:#f3f6f8; font:inherit; font-size:13.5px; color:#41505d; cursor:pointer;}
.pt-quick button:hover{background:#e7edf1;}
.pt-quick button[aria-pressed="true"]{background:#0b1a24; color:#fff;}
.pr-tape .pr-more{margin-top:22px;}
.pr-tape .pr-more .pr-fees thead{display:table-header-group;}
.pr-tape .pr-more .pr-fees{max-width:640px;}
@media (prefers-reduced-motion:reduce){ .pt-marker,.pt-fees span{transition:none;} }
@media (max-width:640px){
  .pr-tape{padding:22px 16px 18px;}
  .pt-read{gap:22px; flex-wrap:wrap;}
  .pt-read b{font-size:34px;} .pt-read .a b{font-size:22px;}
  .pt-hint{display:none;}
  .pt-fees span{font-size:11.5px;}
}

/* pricing in plain words (Mehul 2026-10-27): before the fee tape, four short statements and one worked
   example, so the page explains the model in sentences and not only in bars and sliders */
.pr-plain{background:#fff; border-top:1px solid #eef1f4;}
/* How pricing works (Mehul 2026-10-31: "doesn't look organized"): the worked example as one sum across the top,
   then the four points in one even row, each numbered */
.pp-eq{margin-top:clamp(32px,4vw,48px); padding:26px 30px 22px; border-radius:12px; background:#f6f9fc; box-shadow:inset 0 0 0 1px #e6ecf0;}
.pp-lead{display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 14px; margin:0; font-size:18px; line-height:1.45; color:#0b1a24;}
.pp-k{font-size:12px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:#00605d;}
.pp-sum{display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr); align-items:stretch; gap:14px; margin-top:18px;}
.pp-term{display:flex; flex-direction:column; justify-content:space-between; gap:8px; padding:16px 18px; border-radius:10px; background:#fff; box-shadow:0 0 0 1px #e3e9ee, 0 1px 2px rgba(13,27,42,.04);}
.pp-term small{font-size:13.5px; line-height:1.35; color:#56677a;}
.pp-term b{font-size:clamp(24px,2.3vw,30px); font-weight:700; letter-spacing:-.02em; color:#0b1a24; font-variant-numeric:tabular-nums;}
.pp-tot{background:#0b1a24; box-shadow:none;} .pp-tot small{color:#b8c4ce;} .pp-tot b{color:#fff;}
.pp-op{align-self:center; font-size:24px; font-weight:600; color:#8a97a3;}
.pp-foot{margin:14px 0 0; font-size:14px; line-height:1.55; color:#56677a;}
.pp-list{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:28px; margin:clamp(36px,4vw,52px) 0 0; padding:0; list-style:none;}
.pp-i{padding-top:18px; border-top:1px solid #e3e9ee;}
.pp-n{display:grid; place-items:center; width:26px; height:26px; margin-bottom:14px; border-radius:50%; background:#e6f6f5; color:#00605d; font-size:13px; font-weight:800;}
.pp-i h3{margin:0; font-size:17px; font-weight:600; letter-spacing:-.01em; color:#0b1a24;}
.pp-i p{margin:8px 0 0; font-size:15px; line-height:1.6; color:#56677a; text-wrap:pretty;}
@media (max-width:1000px){ .pp-list{grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 32px;} }
@media (max-width:640px){
  .pp-eq{padding:20px 18px 18px;}
  .pp-sum{grid-template-columns:minmax(0,1fr); gap:6px;}
  .pp-op{justify-self:center; font-size:20px; line-height:1;}
  .pp-term{flex-direction:row; align-items:center; padding:12px 14px;} .pp-term b{font-size:22px; flex:none;}
  .pp-list{grid-template-columns:minmax(0,1fr); gap:22px;}
}
/* the always-included row, heavier (Mehul 2026-10-30: the numbers were too small and thin): a small spaced label on
   top, the figure in a firm semibold with tight tracking and lining figures, the note under it */
.pr-zero2 dt{order:1; margin:0 0 12px; font-size:12px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#62707c;}
.pr-zero2 dd{order:2; font-size:clamp(50px,5.2vw,72px); font-weight:650; letter-spacing:-.045em; line-height:.95; font-variant-numeric:lining-nums tabular-nums; color:#0b1a24;}
.pr-zero2 > div:last-child dd:not(.pr-z-n){color:#007a76; letter-spacing:-.035em;}
.pr-zero2 dd.pr-z-n{order:3; margin-top:12px; font-size:14px; font-weight:500; letter-spacing:0; line-height:1.4; color:#62707c;}
.pr-zero2 > div{padding:30px 24px 32px 0;}
@media (max-width:760px){ .pr-zero2 dd{font-size:44px;} .pr-zero2 dt{margin-bottom:8px;} }
.pr-zero2 > div{min-width:0;}
.pr-zero2 > div:last-child dd:not(.pr-z-n){font-size:clamp(40px,4.1vw,58px);}   /* a word, so a step smaller than the figures to fit its column */
/* the calculator's figures, heavier (Mehul 2026-10-30): the amount you type, what you receive and what families pay
   are the numbers to notice; the platform fee stays quiet */
.pr-in-f input{font-weight:650; letter-spacing:-.02em;}
.pr-in-f i{font-weight:500;}
.pr-row b{font-weight:650; font-size:16px; letter-spacing:-.01em;}
.pr-row b[data-o="fee"]{font-weight:500; font-size:15px; color:var(--pr-text);}
.pr-total b{font-size:30px; font-weight:700; letter-spacing:-.03em;}
/* the fee finder's readout, to match the calculator (2026-10-30): price and fee firm and tight, the add-on fee
   lighter; the active fee band and the marker's price in the same weight */
.pt-read small{font-size:12px; font-weight:800; letter-spacing:.14em;}
.pt-read b{font-weight:650; font-size:48px; letter-spacing:-.04em;}
.pt-read .a b{font-size:28px; font-weight:500; letter-spacing:-.02em;}
.pt-fees span.on{font-weight:800;}
.pt-marker span{font-weight:700;}
@media (max-width:640px){ .pt-read b{font-size:36px;} .pt-read .a b{font-size:22px;} }

/* ---------- Getting started, priced (2026-10-31): a till receipt that totals $0 either way ---------- */
.pr-start{background:#f6f9fc; border-top:1px solid #eef1f4; border-bottom:1px solid #eef1f4; overflow:hidden;}
.pr-start::before{content:""; position:absolute; z-index:-1; left:52%; right:-20%; top:-30%; bottom:-30%; transform:skewY(-6deg);
  background:radial-gradient(ellipse 55% 50% at 50% 50%, rgba(0,188,183,.09), rgba(47,127,214,.04) 55%, transparent 75%);}
.pr-start-in{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,440px); gap:clamp(40px,7vw,120px); align-items:center;}
.pr-start-p{max-width:30em; margin:18px 0 0; font-size:17px; line-height:1.6; color:var(--pr-text);}
/* the switch: two cards, one chosen */
.pr-way{display:grid; grid-template-columns:1fr 1fr; gap:10px; max-width:520px; margin-top:28px;}
.pr-way button{display:flex; flex-direction:column; align-items:flex-start; gap:3px; padding:14px 16px; border-radius:10px; border:1px solid #d9e1e7; background:#fff;
  font:inherit; text-align:left; cursor:pointer; transition:border-color .2s, box-shadow .2s;}
.pr-way button b{font-size:15.5px; font-weight:700; color:var(--pr-ink);}
.pr-way button small{font-size:13px; color:var(--pr-muted);}
.pr-way button[aria-checked="true"]{border-color:var(--pr-teal); box-shadow:0 0 0 3px rgba(0,122,118,.12);}
.pr-way button[aria-checked="true"] b{color:var(--pr-teal);}
.pr-way button:focus-visible{outline:2px solid var(--pr-teal); outline-offset:3px;}
.pr-start-ctas{display:flex; flex-wrap:wrap; align-items:center; gap:14px 22px; margin-top:24px;}
.pr-start-ctas [hidden]{display:none;}
/* the receipt: paper, a torn edge top and bottom, monospaced figures */
.pr-rcpt{position:relative; padding:10px 0; filter:drop-shadow(0 1px 1px rgba(13,27,42,.06)) drop-shadow(0 24px 30px rgba(13,27,42,.16));}
.pr-rcpt-paper{position:relative; padding:28px 28px 24px; background:#fff; color:var(--pr-ink);}
/* the scalloped tear along the top and bottom, drawn in the paper's white just outside it, so the shadow follows it */
.pr-rcpt-paper::before, .pr-rcpt-paper::after{content:""; position:absolute; left:0; right:0; height:9px; background-size:16px 9px; background-repeat:repeat-x;}
.pr-rcpt-paper::before{top:-9px; background-image:radial-gradient(circle at 8px 9px, #fff 7px, transparent 7.5px);}
.pr-rcpt-paper::after{bottom:-9px; background-image:radial-gradient(circle at 8px 0, #fff 7px, transparent 7.5px);}
.pr-rcpt-h{display:flex; flex-direction:column; align-items:center; gap:2px; padding-bottom:16px; border-bottom:1.5px dashed #c9d2da; text-align:center;}
.pr-rcpt-h b{font-size:17px; font-weight:800; letter-spacing:.18em; text-transform:uppercase;}
.pr-rcpt-h small{font-size:12px; color:var(--pr-muted);}
.pr-rcpt-k{display:flex; justify-content:space-between; gap:12px; margin:14px 0 6px; font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:var(--pr-muted);}
.pr-rcpt-l{margin:0; padding:0; list-style:none;}
.pr-rcpt-l li, .pr-rcpt-later div{display:flex; justify-content:space-between; align-items:baseline; gap:16px; padding:7px 0; font-size:14px; line-height:1.4;}
.pr-rcpt-l li span, .pr-rcpt-later span{min-width:0;}
.pr-rcpt-l b, .pr-rcpt-tot b, .pr-rcpt-later b{flex:none; font:700 13.5px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace; color:var(--pr-ink);}
.pr-rcpt-l li{animation:pr-line .35s ease both; animation-delay:calc(var(--i,0) * 60ms);}
@keyframes pr-line{from{opacity:0; transform:translateY(4px)} to{opacity:1; transform:none}}
.pr-rcpt-fixed{margin-top:6px; padding-top:6px; border-top:1px solid #edf1f4;}
.pr-rcpt-tot{display:flex; justify-content:space-between; align-items:baseline; margin-top:10px; padding:14px 0 12px; border-top:1.5px dashed #c9d2da; border-bottom:1.5px dashed #c9d2da;}
.pr-rcpt-tot span{font-size:15px; font-weight:800;}
.pr-rcpt-tot b{font-size:26px; color:#15803d;}
.pr-rcpt-later{margin-top:2px;}
.pr-rcpt-later div{color:var(--pr-text);}
.pr-rcpt-later b{color:var(--pr-teal);}
.pr-rcpt-foot{margin:14px 0 0; text-align:center; font-size:12px; font-weight:700; letter-spacing:.06em; color:var(--pr-muted);}
/* with the switch working, only the chosen list shows; without JavaScript both do */
.pr-rcpt.js [data-list]:not(.on){display:none;}
@media (prefers-reduced-motion:reduce){ .pr-rcpt-l li{animation:none;} }
@media (max-width:900px){
  .pr-start-in{grid-template-columns:minmax(0,1fr);}
  .pr-rcpt{max-width:440px;}
}
@media (max-width:480px){ .pr-way{grid-template-columns:1fr;} .pr-rcpt-paper{padding:26px 18px 22px;} }


/* "Starting costs $0" spacing (Mehul 2026-11-04): the copy sat in a sea of space beside the tall receipt while its own
   parts were packed tight. Less section padding, a closer receipt, and more air between heading, text, switch and buttons. */
.pr-start{padding:clamp(64px,7vw,96px) 0;}
.pr-start-in{gap:clamp(40px,6vw,96px);}
.pr-start-p{margin-top:20px;}
.pr-way{gap:12px; margin-top:36px;}
.pr-way button{gap:4px; padding:16px 18px;}
.pr-start-ctas{margin-top:32px;}
.pr-start-copy .pc-sh{max-width:14em;}  /* two even lines, not one long line that leaves the column short */
/* the copy and the receipt sit together as one centred pair instead of at the two far edges with a void between */
@media (min-width:901px){ .pr-start-in{grid-template-columns:minmax(0,560px) minmax(0,440px); justify-content:center;} }