/* Class page v1 (public Online Class page, scripts/classpage.py). Loaded ONLY on /class/, after site.<hash>.css + tokens.<hash>.css,
   so the shared bundle stays byte-identical on all 6 hosts (parity). Rules = the class-page part of Creative's
   brand/specs/hub-layout-v2.css v0.2 (offer panel, price, module cards, 46rem axis, FAQ link colour), verbatim, minus the
   mockup-only tags (.ph, .pending) and the hub-only bands; plus the hero class cover (brand/specs/class-cover-v1.md: 16:9, radius 24,
   glass border, navy while loading). Pure CSS, CSP-safe (style-src 'self'; no script). */

/* class page: one 46rem content axis for every section (matches How it works / FAQ / signup) */
.page--class > .section > .container{max-width:calc(var(--layout-container-mid,46rem) + 2 * var(--layout-gutter,24px))}

/* hero class cover */
.class-cover{margin:var(--space-6,32px) auto 0;max-width:46rem}
.class-cover img{display:block;width:100%;height:auto;aspect-ratio:16 / 9;object-fit:cover;border-radius:var(--glass-radius,24px);
  border:1px solid var(--glass-border,rgba(255,255,255,.14));background:#101115;box-shadow:var(--glass-shadow,0 20px 50px -12px rgba(0,0,0,.55))}

/* offer panel = the signup-panel shell, no form */
.offer{display:grid;gap:16px;text-align:center;justify-items:center}
.offer__name{margin:0;font-family:var(--font-heading,"Nunito",sans-serif);font-weight:800;font-size:clamp(24px,3vw,30px);line-height:1.2;color:#fff;text-wrap:balance}
.offer__lead{margin:0;max-width:44ch;color:#CFD6E1;font-size:18px;line-height:1.55}
.price{display:grid;gap:4px;justify-items:center;margin:4px 0;padding:16px 24px;border-radius:12px;background:rgba(23,24,29,.80);border:1px solid var(--glass-border,rgba(255,255,255,.12));min-width:min(100%,20rem)}
.price__amount{margin:0;font-family:var(--font-heading,"Nunito",sans-serif);font-weight:800;font-size:34px;line-height:1.1;color:#fff}
.price__note{margin:0;color:#B4BCCB;font-size:15px}
.offer__ctas{display:grid;gap:12px;width:100%;max-width:26rem}
/* price: one sentence, amount large */
.price__line{margin:0;display:block;text-align:center;color:#fff}
.price__line strong{font-weight:inherit}
.price__line .price__amount{display:block;font-size:40px;line-height:1.1}
.price__line .price__note{display:block;margin-top:4px;color:#CFD6E1;font-size:16px;font-weight:600}

/* module list (What's in the Class): one glass card per module, numbered disc in the master accent */
.modules{list-style:none;margin:0;padding:0;display:grid;gap:16px;grid-template-columns:1fr}
@media (min-width:768px){.modules{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}}
.module{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 16px;align-items:start;padding:20px 24px;border-radius:var(--glass-radius-card,16px);
  border:1px solid var(--glass-border,rgba(255,255,255,.14));background:var(--glass-fill,rgba(23,24,29,.85));
  -webkit-backdrop-filter:var(--glass-blur,blur(22px));backdrop-filter:var(--glass-blur,blur(22px));
  box-shadow:var(--glass-highlight,inset 0 1px 0 rgba(255,255,255,.22)),var(--glass-shadow,0 20px 50px -12px rgba(0,0,0,.55))}
.module__n{grid-row:span 2;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#2FD3EE;color:#0B0C10;font-family:var(--font-heading,"Nunito",sans-serif);font-weight:800;font-size:18px}
.module__title{margin:0;font-family:var(--font-heading,"Nunito",sans-serif);font-weight:800;font-size:19px;line-height:1.3;color:#48D8F0;overflow-wrap:anywhere;text-wrap:balance}
.module__meta{margin:0;color:#B4BCCB;font-size:15px}
.included-note{margin:20px auto 0;text-align:center;color:#B4BCCB;max-width:52ch}
.included-note + .included-note{margin-top:8px}

/* How to get started: the cta2 panel with the checkout step line above the Buy button */
.class-start__text{margin:0 auto var(--space-5,24px);max-width:48ch;color:#CFD6E1;font-size:18px;line-height:1.55}
.page--class .cta2__title{margin-bottom:var(--space-3,12px)}

/* FAQ answer links (refund page) in the cyan link colour */
.faq details > p a{color:#9BE8F6}
/* CLASS-PAGES-EDU-ASST-HUB 2026-10-25: module one-liners, What's in the Class intro, sponsor email block (Nebula night; no new colours) */
.module__desc{grid-column:2;margin:var(--space-2) 0 0;font-size:.9375rem;line-height:1.55;opacity:.88}
.class-intro{max-width:46rem;margin:0 0 var(--space-5)}
.class-email{margin:0 0 var(--space-5);padding:var(--space-4) var(--space-5);border-radius:12px;background:rgba(0,0,0,.45);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);white-space:pre-wrap;word-break:break-word;overflow-x:auto;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9375rem;line-height:1.6;color:#E6E9EF}
.class-email:focus-visible{outline:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12),var(--dk-focus-ring)}
.module__lessons{grid-column:2;margin:var(--space-3) 0 0;padding-left:1.1em;font-size:.9375rem;line-height:1.55;opacity:.88}
.module__lessons li + li{margin-top:var(--space-1)}
