/* Conversion improvements (Nov 2026): hero outcome line, recommended plan, GST-inclusive totals,
   instructor proof near pricing, cheat-sheet opt-in. Uses the existing tokens from index.html. */

/* Hero */
.hero .lede .hero-outcome{display:block;margin:0 0 8px;font:700 var(--type-lead)/1.45 var(--display);color:var(--navy);letter-spacing:-.01em}
:root[data-theme="dark"] .hero .lede .hero-outcome{color:#E9ECF5}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .hero .lede .hero-outcome{color:#E9ECF5}}
main .hero .hero-cta-2{gap:9px}
main .hero .hero-cta-2 .hero-play{flex:none}
#pb-demo{scroll-margin-top:96px}

/* Recommended plan */
#pricing .plans .ticket.pop .badge.badge-pop{display:inline-flex;align-items:center;gap:6px;background:var(--gold)!important;color:#0E1B3D!important;border-color:var(--gold)!important;font-weight:800;letter-spacing:.04em}
#pricing .ticket .plus500{margin:16px 0 4px;padding:14px 16px;border-radius:12px;background:var(--good-soft,#DDF1EA);border:1px solid #BFE6D6;font:500 14px/1.5 var(--body);color:var(--ink)}
#pricing .ticket .plus500 b{color:#0A6B4E}
#pricing .ticket .plus500 ul{list-style:none;margin:8px 0 0!important;padding:0!important;display:grid!important;grid-template-columns:1fr 1fr;gap:4px 12px!important;font-size:13.5px!important}
#pricing .ticket .plus500 li{display:flex!important;gap:6px!important;margin:0!important;padding:0!important;font:600 13px/1.35 var(--body);color:#0E1B3D}
#pricing .ticket .plus500 li::before{content:"✓"!important;position:static!important;flex:none;width:auto!important;height:auto!important;background:none!important;color:#0A7D5B!important;font-weight:800;transform:none!important}
@media (max-width:380px){#pricing .ticket .plus500 ul{grid-template-columns:1fr}}

/* GST-inclusive totals (display only; checkout adds GST on the server) */
#pricing .ticket .gst-total{margin-top:4px;font:500 13px/1.4 var(--body);color:var(--muted)}

/* Instructor proof near pricing */
#pricing .price-proof{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:14px 18px;max-width:980px;margin:28px auto 0;padding:18px 22px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}
#pricing .price-proof .pp-photo{width:64px;height:64px;border-radius:50%;object-fit:cover;object-position:50% 20%;background:var(--surface-2)}
#pricing .price-proof h3{margin:0;font:800 17px/1.3 var(--display);letter-spacing:-.01em;color:var(--ink)}
#pricing .price-proof .pp-who span{display:block;margin-top:2px;font:500 13.5px/1.4 var(--body);color:var(--muted)}
#pricing .price-proof .pp-facts{grid-column:1/-1;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
#pricing .price-proof .pp-facts li{margin:0;padding:12px 14px;border-radius:12px;background:var(--bg)}
#pricing .price-proof .pp-facts li::before{content:none!important}
#pricing .price-proof .pp-facts li.pp-link{padding:0}
#pricing .price-proof .pp-facts a{display:block;height:100%;padding:12px 14px;border-radius:12px;color:inherit;text-decoration:none}
#pricing .price-proof .pp-facts a:hover{background:var(--surface-2)}
#pricing .price-proof .pp-facts b{display:block;font:800 16px/1.25 var(--display);color:var(--ink)}
#pricing .price-proof .pp-facts b [aria-hidden]{color:#C98A00}
#pricing .price-proof .pp-facts li > span,#pricing .price-proof .pp-facts a > span{display:block;margin-top:2px;font:500 13px/1.4 var(--body);color:var(--muted)}
@media (min-width:900px){
  #pricing .price-proof{grid-template-columns:auto minmax(200px,1fr) 2.4fr}
  #pricing .price-proof .pp-facts{grid-column:auto}
}
@media (max-width:560px){
  #pricing .price-proof{padding:16px}
  #pricing .price-proof .pp-facts{grid-template-columns:1fr}
}

/* Cheat-sheet lead form: explicit opt-in + next step */
.tpx-lead-f .tpx-optin{grid-column:1/-1;display:flex;align-items:flex-start;gap:10px;margin:2px 0;font:500 13.5px/1.45 var(--body);color:inherit;cursor:pointer;text-align:left}
.tpx-lead-f .tpx-optin input{flex:none;width:20px;height:20px;min-width:20px;margin:1px 0 0;padding:0;border-radius:4px;accent-color:var(--gold);cursor:pointer}
.tpx-lead-ok{gap:10px}
.tpx-lead-ok:focus{outline:none}
.tpx-lead-ok:focus-visible{outline:3px solid var(--gold);outline-offset:4px;border-radius:8px}
.tpx-lead-ok .tpx-lead-next{display:block;width:100%;font:500 14.5px/1.5 var(--body)}
.tpx-lead-ok .tpx-lead-actions{display:flex;flex-wrap:wrap;gap:10px;width:100%}
@media (max-width:560px){.tpx-lead-ok .tpx-lead-actions .btn{width:100%;justify-content:center}}
