  :root{
    --ink:#12161c; --ink-2:#3d4a5c; --muted:#6b7789;
    --navy:#060d18; --navy-2:#122a4d; --gold:#c4a35a; --gold-light:#e0c57a;
    --line:rgba(14,20,27,.1); --surface:#fbfaf7; --page:#e8ecf1;
    --ok:#0d7a3f; --plan:#1c5cab; --cream:#eef2f6;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html.fedm8-embed header,html.fedm8-embed header.site-top,html.fedm8-embed #site-top,html.fedm8-embed .site-top{display:none!important}
  html.fedm8-embed body{background:#f8f9fb}
  body{
    font-family:"DM Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; color:var(--ink);
    background:
      radial-gradient(1000px 480px at 8% -10%, rgba(201,162,39,.12), transparent 50%),
      radial-gradient(900px 420px at 100% 0%, #d5e0ec, transparent 55%),
      linear-gradient(180deg, #f0f3f7 0%, var(--page) 45%);
    line-height:1.55; min-height:100vh;
  }
  a{color:var(--plan)}
  .wrap{width:min(1080px, calc(100% - 40px)); margin:0 auto}
  .wrap-narrow{width:min(760px, calc(100% - 40px)); margin:0 auto}

  header{background:var(--navy); color:#fff; border-bottom:3px solid var(--gold)}
  header .wrap{display:flex;align-items:center;gap:14px;padding:14px 0;flex-wrap:wrap}
  .brand{color:#fff;text-decoration:none;font-weight:750;letter-spacing:-.02em;font-size:17px}
  .brand em{font-style:normal;color:var(--gold-light)}
  .pill{
    font-size:10px;font-weight:750;letter-spacing:.12em;text-transform:uppercase;
    border:1px solid rgba(227,197,101,.45); color:var(--gold-light);
    padding:5px 10px; border-radius:2px;
  }
  .back{margin-left:auto;color:#b0becd;text-decoration:none;font-size:13.5px}
  .back:hover{color:#fff}

  /* :  Campus hero :  */
  .campus{
    position:relative; overflow:hidden; color:#fff;
    background:var(--navy);
    border-bottom:1px solid rgba(227,197,101,.25);
  }
  .campus-art{
    display:block; width:100%; height:clamp(180px, 28vw, 280px);
    object-fit:cover; object-position:center bottom; opacity:.95;
  }
  .campus-copy{
    position:relative; padding:8px 0 28px;
  }
  .campus-copy .eyebrow{
    font-size:11px; font-weight:750; letter-spacing:.16em; text-transform:uppercase;
    color:var(--gold-light); margin-bottom:8px;
  }
  .campus h1{
    font-family:"Source Serif 4",Georgia,"Times New Roman",serif;
    font-size:clamp(2.2rem, 4.5vw, 3.4rem); font-weight:700;
    letter-spacing:-.02em; line-height:1.05; margin:0 0 10px;
  }
  .campus .lead{color:#c5d2e0; max-width:42ch; font-size:1.08rem; margin-bottom:14px}
  .campus-quote{
    max-width:48ch; font-family:"Source Serif 4",Georgia,"Times New Roman",serif;
    font-style:italic; font-size:1.25rem; color:var(--gold-light);
    border-left:2px solid rgba(227,197,101,.55); padding-left:14px; margin:0;
  }

  main{padding:28px 0 90px}
  #view-catalog, #view-classroom{animation:rise .35s ease}
  @keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

  .lp-bar{height:5px;border-radius:2px;background:rgba(14,20,27,.08);overflow:hidden;margin:0 0 8px;max-width:420px}
  .lp-fill{height:100%;width:0;background:linear-gradient(90deg,var(--gold),var(--gold-light));transition:width .4s}
  .lp-line{font-size:13.5px;color:var(--ink-2);margin:0 0 18px}
  .lp-continue{
    font:inherit;font-size:13px;font-weight:650;background:none;border:none;
    color:var(--plan);cursor:pointer;text-decoration:underline;text-underline-offset:2px;
    padding:0;margin-left:8px;
  }

  /* :  School halls :  */
  .halls{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0 0 28px}
  @media(max-width:800px){.halls{grid-template-columns:1fr}}
  .hall{
    position:relative; text-align:left; cursor:pointer;
    border:1px solid var(--line); background:var(--surface);
    padding:0; overflow:hidden; font:inherit; color:inherit;
    transition:border-color .2s, transform .2s, box-shadow .2s;
  }
  .hall:hover{border-color:rgba(201,162,39,.55); transform:translateY(-2px); box-shadow:0 12px 28px rgba(6,13,24,.08)}
  .hall.on{border-color:var(--navy); box-shadow:0 0 0 2px var(--navy)}
  .hall-banner{
    height:88px; display:flex; align-items:flex-end; padding:12px 16px;
    background-size:cover; background-position:center;
  }
  .hall[data-s="free"] .hall-banner{
    background:
      linear-gradient(135deg, rgba(6,13,24,.75), rgba(13,122,63,.45)),
      repeating-linear-gradient(90deg, transparent, transparent 18px, rgba(255,255,255,.04) 18px, rgba(255,255,255,.04) 19px),
      #0d3d28;
  }
  .hall[data-s="basic"] .hall-banner{
    background:
      linear-gradient(135deg, rgba(6,13,24,.8), rgba(28,92,171,.5)),
      radial-gradient(circle at 80% 20%, rgba(227,197,101,.25), transparent 40%),
      #122a4d;
  }
  .hall[data-s="pro"] .hall-banner{
    background:
      linear-gradient(135deg, rgba(6,13,24,.85), rgba(138,106,0,.45)),
      radial-gradient(circle at 20% 80%, rgba(227,197,101,.3), transparent 45%),
      #3a2e0a;
  }
  .hall-banner span{
    font-family:"Source Serif 4",Georgia,"Times New Roman",serif; color:#fff;
    font-size:1.35rem; font-weight:650; letter-spacing:-.01em;
  }
  .hall-body{padding:14px 16px 16px}
  .hall-body p{font-size:13.5px; color:var(--ink-2); margin:0}
  .hall-meta{font-size:11px; font-weight:750; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-top:10px}

  .filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}
  .filters button{
    border:1px solid var(--line); background:#fff; color:var(--ink-2);
    border-radius:2px; padding:8px 14px; font:650 13px/1 inherit; cursor:pointer;
  }
  .filters button.on{background:var(--navy); color:#fff; border-color:var(--navy)}
  #school-blurb{font-size:15px;color:var(--ink-2);margin:0 0 18px;max-width:56ch}

  .quote-strip{
    margin:0 0 24px; padding:16px 18px;
    background:linear-gradient(90deg, rgba(201,162,39,.1), transparent);
    border-left:3px solid var(--gold);
    font-family:"Source Serif 4",Georgia,"Times New Roman",serif;
    font-style:italic; font-size:1.35rem; color:var(--navy);
  }

  /* :  Course catalog (not FAQ bubbles) :  */
  .wing{margin-bottom:36px}
  .wing-head{
    display:flex; align-items:flex-end; gap:16px; flex-wrap:wrap;
    margin-bottom:14px; padding-bottom:10px;
    border-bottom:1px solid var(--line);
  }
  .wing-visual{
    width:72px; height:72px; flex-shrink:0;
    border:1px solid rgba(201,162,39,.35); background:var(--cream);
    display:grid; place-items:center;
  }
  .wing-visual svg{width:48px;height:48px}
  .wing-head h2{
    font-family:"Source Serif 4",Georgia,"Times New Roman",serif;
    font-size:1.55rem; font-weight:650; color:var(--navy); letter-spacing:-.02em;
  }
  .wing-head .cap{font-size:13.5px; color:var(--ink-2); max-width:48ch}

  .catalog{display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:14px}
  .course{
    background:var(--surface); border:1px solid var(--line);
    display:flex; flex-direction:column; min-height:220px;
    cursor:pointer; text-align:left; font:inherit; color:inherit; padding:0;
    transition:border-color .2s, transform .15s;
  }
  .course:hover{border-color:var(--navy); transform:translateY(-2px)}
  .course-cover{
    height:96px; padding:14px 16px; display:flex; flex-direction:column; justify-content:flex-end;
    color:#fff; position:relative; overflow:hidden;
  }
  .course-cover::after{
    content:""; position:absolute; inset:0; opacity:.35;
    background:repeating-linear-gradient(-12deg, transparent, transparent 10px, rgba(255,255,255,.06) 10px, rgba(255,255,255,.06) 11px);
  }
  .course.tier-free .course-cover{background:linear-gradient(145deg,#060d18,#1a5c3a)}
  .course.tier-basic .course-cover{background:linear-gradient(145deg,#060d18,#1c5cab)}
  .course.tier-pro .course-cover{background:linear-gradient(145deg,#060d18,#8a6a00)}
  .course-cover .tier-mark{
    position:relative; z-index:1;
    font-size:10px; font-weight:750; letter-spacing:.1em; text-transform:uppercase;
    color:var(--gold-light); margin-bottom:4px;
  }
  .course-cover h3{
    position:relative; z-index:1;
    font-family:"Source Serif 4",Georgia,"Times New Roman",serif;
    font-size:1.25rem; font-weight:650; line-height:1.2; letter-spacing:-.01em;
  }
  .course-body{padding:14px 16px 16px; flex:1; display:flex; flex-direction:column}
  .course-about{font-size:12.5px; color:var(--muted); margin-bottom:6px}
  .course-blurb{font-size:14px; color:var(--ink-2); flex:1}
  .course-foot{display:flex; align-items:center; gap:8px; margin-top:12px; flex-wrap:wrap}
  .course-foot .enter{
    font-size:13px; font-weight:700; color:var(--navy);
    text-decoration:underline; text-underline-offset:3px;
  }
  .lp-badge{font-size:10px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;border-radius:2px;padding:2px 8px}
  .lp-badge.done{color:#0d7a3f;background:rgba(13,122,63,.1);border:1px solid rgba(13,122,63,.35)}
  .lp-badge.part{color:var(--muted);background:rgba(14,20,27,.06)}
  .quiz-mark{font-size:10px;font-weight:750;letter-spacing:.06em;text-transform:uppercase;color:#8a6a00;background:#fff4d6;padding:2px 7px;border:1px solid rgba(138,106,0,.25)}

  /* :  Classroom :  */
  .classroom-nav{margin-bottom:18px}
  .classroom-nav button{
    font:650 13.5px/1 inherit; background:none; border:none; color:var(--plan);
    cursor:pointer; text-decoration:underline; text-underline-offset:2px; padding:0;
  }
  .lesson-hero{
    display:grid; grid-template-columns:1.1fr 0.9fr; gap:0;
    border:1px solid var(--line); background:var(--surface); margin-bottom:22px; overflow:hidden;
  }
  @media(max-width:760px){.lesson-hero{grid-template-columns:1fr}}
  .lesson-hero-copy{padding:28px 26px}
  .lesson-hero-copy .badge{
    display:inline-block; font-size:10px; font-weight:750; letter-spacing:.1em; text-transform:uppercase;
    padding:4px 8px; margin-bottom:10px; border:1px solid var(--line);
  }
  .lesson-hero-copy .badge.free{color:var(--ok); border-color:rgba(13,122,63,.35); background:#e8f6ee}
  .lesson-hero-copy .badge.basic{color:var(--plan); border-color:rgba(28,92,171,.35); background:#e8f1fd}
  .lesson-hero-copy .badge.pro{color:#8a6a00; border-color:rgba(138,106,0,.35); background:#fff4d6}
  .lesson-hero-copy h1{
    font-family:"Source Serif 4",Georgia,"Times New Roman",serif;
    font-size:clamp(1.8rem, 3vw, 2.4rem); color:var(--navy); letter-spacing:-.02em; margin:0 0 10px;
  }
  .lesson-hero-copy .meta{font-size:13.5px; color:var(--muted)}
  .lesson-hero-art{
    min-height:200px; display:flex; flex-direction:column; justify-content:flex-end;
    padding:20px; color:#fff; position:relative;
  }
  .lesson-hero-art.tone-seal{background:linear-gradient(160deg,#060d18,#1a5c3a)}
  .lesson-hero-art.tone-map{background:linear-gradient(160deg,#060d18,#1c5cab)}
  .lesson-hero-art.tone-compass{background:linear-gradient(160deg,#122a4d,#3a2e0a)}
  .lesson-hero-art.tone-radar{background:linear-gradient(160deg,#060d18,#1a3a68)}
  .lesson-hero-art.tone-scale{background:linear-gradient(160deg,#060d18,#0d7a3f)}
  .lesson-hero-art.tone-board{background:linear-gradient(160deg,#122a4d,#060d18)}
  .lesson-hero-art.tone-path{background:linear-gradient(160deg,#060d18,#c4a35a)}
  .lesson-hero-art.tone-stamp{background:linear-gradient(160deg,#1a3a68,#060d18)}
  .lesson-hero-art.tone-chart{background:linear-gradient(160deg,#060d18,#8a6a00)}
  .lesson-hero-art.tone-matrix{background:linear-gradient(160deg,#122a4d,#1c5cab)}
  .lesson-hero-art.tone-target{background:linear-gradient(160deg,#3a2e0a,#060d18)}
  .lesson-hero-art.tone-gate{background:linear-gradient(160deg,#060d18,#122a4d)}
  .lesson-hero-art svg{position:absolute; inset:16px; width:calc(100% - 32px); height:calc(100% - 72px); opacity:.35}
  .lesson-hero-art .art-label{position:relative; z-index:1; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--gold-light); font-weight:750}
  .lesson-hero-art .art-cap{position:relative; z-index:1; font-family:"Source Serif 4",Georgia,"Times New Roman",serif; font-size:1.35rem; margin-top:6px; font-style:italic}

  .prose{font-size:16px; color:var(--ink-2); margin:0 0 14px; max-width:58ch}
  .section-label{
    font-family:"Source Serif 4",Georgia,"Times New Roman",serif; font-size:1.25rem; font-weight:650;
    color:var(--navy); margin:28px 0 10px; letter-spacing:-.02em;
  }
  .lesson-body ol,.lesson-body ul{margin:0 0 0 1.15rem; max-width:58ch}
  .lesson-body li{font-size:15.5px; color:var(--ink-2); margin:8px 0; line-height:1.55}
  .try{
    margin-top:22px; padding:18px 18px; border:1px solid rgba(201,162,39,.4);
    background:linear-gradient(180deg,#f4f7fb,#eef3f8); max-width:58ch;
  }
  .try .label{font-size:11px; font-weight:750; letter-spacing:.1em; text-transform:uppercase; color:#8a6a00; margin-bottom:6px}
  .try p{font-size:16px; color:var(--ink); margin:0; font-weight:550}
  .actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
  .tool-link{
    display:inline-block; background:var(--navy); color:#fff;
    text-decoration:none; font-weight:700; font-size:13.5px; padding:11px 16px; border-radius:2px;
  }
  .tool-link.ghost{background:#fff;color:var(--navy);border:1px solid var(--line)}

  .visual-example{
    margin:22px 0; padding:18px; border:1px solid var(--line); background:#fff; max-width:640px;
  }
  .visual-example h4{
    font-family:"Source Serif 4",Georgia,"Times New Roman",serif; font-size:1.15rem; color:var(--navy); margin-bottom:10px;
  }
  .visual-example .flow{
    display:flex; flex-wrap:wrap; gap:8px; align-items:center; font-size:13.5px; font-weight:650; color:var(--navy);
  }
  .visual-example .step{
    background:var(--cream); border:1px solid rgba(201,162,39,.35); padding:10px 12px; min-width:100px; text-align:center;
  }
  .visual-example .arrow{color:var(--gold); font-size:18px}
  .visual-example .note{font-size:13px; color:var(--ink-2); margin-top:10px; font-style:italic}

  /* :  Quiz :  */
  .quiz{
    margin:32px 0 0; padding:22px 20px; border:1px solid var(--navy);
    background:linear-gradient(180deg,#fff,#f7f9fc); max-width:640px;
  }
  .quiz h3{
    font-family:"Source Serif 4",Georgia,"Times New Roman",serif; font-size:1.45rem; color:var(--navy); margin-bottom:6px;
  }
  .quiz .q-intro{font-size:14px; color:var(--ink-2); margin-bottom:16px}
  .q-block{margin-bottom:16px; padding-bottom:14px; border-bottom:1px solid var(--line)}
  .q-block:last-of-type{border-bottom:none}
  .q-block p{font-weight:650; color:var(--navy); margin-bottom:8px}
  .q-block label{
    display:block; font-size:14.5px; color:var(--ink-2); padding:8px 10px; margin:4px 0;
    border:1px solid transparent; cursor:pointer;
  }
  .q-block label:hover{background:#f0f3f7}
  .q-block label.on{border-color:var(--navy); background:#eef3f8}
  .q-block input{margin-right:8px}
  .quiz-result{margin-top:12px; font-size:15px; font-weight:650}
  .quiz-result.pass{color:var(--ok)}
  .quiz-result.fail{color:#8a3a00}
  .quiz button.submit{
    margin-top:8px; background:var(--navy); color:#fff; border:none;
    font:700 13.5px inherit; padding:10px 16px; cursor:pointer; border-radius:2px;
  }

  footer{background:var(--navy);color:#8fa3b8;font-size:13px;padding:22px 0;margin-top:40px;border-top:3px solid var(--gold)}
  footer .wrap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
  footer a{color:#c5d2e0}
  .empty{padding:18px; border:1px dashed var(--line); color:var(--ink-2); background:var(--surface)}

.wing[data-ft-handoff]{margin:18px 0;padding:16px 18px;border-left:4px solid var(--gold,#c4a35a);background:var(--surface,#fff)}
.hall-banner{background:linear-gradient(135deg,#060d18,#1a3a68)}
.help-h{display:inline}
.prose-quote{margin-top:28px;font-family:"Source Serif 4",Georgia,"Times New Roman",serif;font-style:italic;font-size:1.2rem;color:var(--navy)}
