/* AI recorded-course preview pages only. Brand tokens come from site.css. */
.aio-preview{background:rgba(250,193,44,.12);border-bottom:1px solid var(--line);color:var(--y-200);text-align:center;padding:10px 16px;font-size:14px;font-weight:700}
.aio-hero h1{font-size:clamp(28px,4.4vw,50px)}
.aio-colon{font-weight:700;color:var(--ink)}
.aio-cta{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:22px}
.aio-hook{display:block;margin-top:10px;font-size:clamp(22px,3.2vw,34px);font-weight:800;line-height:1.35}
.aio-sub{display:block;margin-top:6px;font-size:.86em;font-weight:700;color:var(--muted)}
.aio-sub.grad{font-size:.92em;font-weight:800;color:transparent}
.aio-cards h3{margin:0 0 10px;line-height:1.35}
.aio-list{margin:0;padding:0;list-style:none;display:grid;gap:12px}
.aio-list li{position:relative;padding:14px 16px 14px 44px;background:var(--glass);border:1px solid var(--line);border-radius:14px}
.aio-list li::before{content:"✓";position:absolute;left:16px;color:var(--c1);font-weight:800}
.aio-syl{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.aio-step{display:flex;gap:16px;align-items:flex-start;padding:20px 22px;border:1px solid var(--line);border-radius:var(--r);background:var(--glass)}
.aio-num{flex:0 0 auto;font-family:var(--mono);color:var(--c1);font-weight:800;font-size:18px;line-height:1.4}
.aio-step h3{margin:0 0 6px;font-size:20px}
.aio-step p{margin:0;color:var(--muted)}
.aio-final{margin:28px 0 8px;padding:28px 28px 26px;border:1.5px solid rgba(250,193,44,.55);background:radial-gradient(640px 220px at 0% 0%,rgba(250,193,44,.22),transparent),var(--glass);box-shadow:0 10px 40px rgba(250,193,44,.12)}
.aio-final h2{margin:10px 0 10px}
.aio-final p{margin:0;color:var(--ink);font-size:18px}
.aio-price{margin:64px 0 0;padding:32px;text-align:left}
.aio-price h2{margin:10px 0 10px;font-size:clamp(28px,3.2vw,40px)}
.aio-price p{color:var(--muted);margin:0}
.aio-meta .card{margin:0}
.aio-meta h3{margin:0 0 8px}
.aio-meta p{margin:0;color:var(--muted)}
.aio-end{margin:48px 0 24px;text-align:left}
.aio-end p{color:var(--muted);margin:0 0 8px}
@media (max-width:760px){
  .aio-step{padding:16px}
  .aio-final,.aio-price{padding:22px}
  .aio-split{grid-template-columns:1fr}
}
