/* The static pages (/pricing/, /faq/, /how-it-works/, /affiliates/, /safety/, /about/, /learn/<lesson>/): written by tools/build_pages.py.
   They reuse site.css (tokens, buttons, tables) and simple.css (the one-column header and footer); this sheet adds only what they need. Classic paper, ink and lime. */
.pg main{padding-bottom:24px}
.pg-nav{display:flex;align-items:center;gap:4px 14px;flex-wrap:wrap}
.pg-nav a:not(.btn){color:var(--ink);text-decoration:none;padding:6px 2px}
.pg-nav a:not(.btn):hover,.pg-nav a:not(.btn):focus-visible,.pg-nav a[aria-current="page"]{text-decoration:underline;text-decoration-color:var(--lime);text-decoration-thickness:3px}
.pg-nav .btn{padding:6px 14px;text-decoration:none}
.crumbs{margin:24px 0 0;font-family:var(--mono);font-size:12.5px;letter-spacing:.04em;color:var(--muted)}
.crumbs a{color:var(--ink)}
.pg h1{font-size:clamp(30px,5.4vw,44px);margin:12px 0 10px}
.pg h2{font-size:clamp(23px,3.6vw,30px);margin:40px 0 10px}
.pg h3{font-size:20px;margin:24px 0 6px;scroll-margin-top:64px}
.pg p,.pg li{max-width:68ch}
.pg main ul,.pg main ol{padding-left:22px}
.pg li{margin:6px 0}
.pg main p a,.pg main li a{color:var(--ink)}
.ht-steps{display:grid;gap:10px}
.pg-plans{display:grid;gap:14px;grid-template-columns:1fr}
@media(min-width:700px){.pg-plans{grid-template-columns:1fr 1fr}}
.pg-plan{border:1px solid var(--line);border-radius:8px;background:var(--win,var(--paper-2));padding:6px 16px 8px;box-shadow:3px 3px 0 var(--line)}
.pg-plan h3{margin-top:12px}
.pg-price{margin:4px 0}
.pg-price .num{font-size:30px}
.pg-price .per{color:var(--muted)}
.pg-table{overflow-x:auto;border:1px solid var(--line);border-radius:8px;background:var(--win,var(--paper-2));margin:12px 0}
.pg-table table{width:100%;min-width:640px;border-collapse:collapse;font-size:14px}
.pg-table th,.pg-table td{padding:8px 10px;text-align:left;vertical-align:top;border-bottom:1px solid var(--hair)}
.pg-table caption{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pg-table thead th{background:var(--lime-soft)}
.pg-foot-links{display:flex;flex-wrap:wrap;gap:6px 16px;font-family:var(--display);font-weight:600}
.pg .early-note{border-left:4px solid var(--lime);padding:2px 0 2px 12px}
.pg .affiliate-widget{margin:12px 0}
.pg .pad{padding:12px 16px;margin:0}
/* lesson pages */
.pg-video{margin:18px 0}
.pg-video video{display:block;width:100%;height:auto;aspect-ratio:16/10;background:#0f1211;border:1px solid var(--line);border-radius:8px}
.pg-lessons{columns:1;list-style:none;padding:0}
@media(min-width:700px){.pg-lessons{columns:2;column-gap:28px}}
.pg-lessons li{break-inside:avoid;margin:0 0 8px}
.pg-lessons .dur{font-family:var(--mono);font-size:12.5px;color:var(--muted)}
.pg-transcript p{margin:0 0 12px}
.pg-meta{font-family:var(--mono);font-size:12.5px;color:var(--muted)}
/* the desk's small tools on their own pages */
.pg #pricecalc-root,.pg .near-frame .su-body{padding:16px}
.pg .calc-frame,.pg .near-frame{margin:16px 0}