/* Academy redesign (2026-10-09). Loaded after academy.html's inline styles and overrides them:
   calmer surfaces, hairline borders, one motion curve, and a clearer learn -> exam -> certificate
   flow. Class names match the markup academy.html's script generates. */

:root{
  --ease:cubic-bezier(.32,.72,0,1);
  --hair:rgba(255,255,255,.08);
  --hair-strong:rgba(255,255,255,.14);
  --surface:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.022));
  --solid:#0c1422;
  --lift:0 1px 0 rgba(255,255,255,.05) inset,0 18px 40px -24px rgba(0,0,0,.75);
  --green:#30d68b;
  --gold:#e6bd5a;
  --text:#f3f6fa;
  --muted:#9aacbf;
}
html{background:#05090f}
body{background:
  radial-gradient(1000px 560px at 85% -6%,rgba(48,214,139,.08),transparent 62%),
  radial-gradient(820px 560px at -8% 30%,rgba(64,132,255,.07),transparent 60%),
  #05090f;background-attachment:fixed;color:var(--text);letter-spacing:-.006em}
.wrap{max-width:1180px;padding:0 24px}
:is(a,button,input,textarea,[tabindex]):focus-visible{outline:2px solid rgba(48,214,139,.85);outline-offset:3px;border-radius:8px}

/* ── Header ─────────────────────────────────────────────── */
header{background:rgba(6,11,19,.6);border-bottom:1px solid var(--hair);backdrop-filter:saturate(180%) blur(22px);-webkit-backdrop-filter:saturate(180%) blur(22px)}
nav{height:60px}
.logo-mark{border-radius:10px}
.logo-name{font-size:16px}
.nav-links{gap:6px}
.nav-links a{padding:7px 12px;border-radius:999px;font-size:13.5px;color:#b4c3d3;transition:background-color .25s var(--ease),color .25s var(--ease)}
.nav-links a:hover{background:rgba(255,255,255,.07);color:#fff}
.nav-links a.active{background:rgba(48,214,139,.12);color:var(--green)}
.nav-links a.nav-cta,.nav-cta{margin-left:8px;padding:8px 16px;border-radius:999px;background:linear-gradient(180deg,#3fe59c,#24c47c);color:#04140c;box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 8px 20px -10px rgba(48,214,139,.8)}
.nav-links a.nav-cta:hover{background:linear-gradient(180deg,#55eeaa,#2bd086);color:#04140c;transform:translateY(-1px)}
.mob{background:rgba(8,13,22,.92);border-bottom:1px solid var(--hair);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);padding:8px 24px 18px}
.mob.open{animation:acFade .35s var(--ease) both}
.mob a{border-bottom:1px solid var(--hair);font-size:15px}

/* ── Hero ───────────────────────────────────────────────── */
.a-hero{min-height:0;border-bottom:1px solid var(--hair)}
.a-hero-bg{background:#05090f}
.a-hero-bg img{filter:brightness(.55) saturate(1.05);will-change:opacity}
@keyframes heroPhotoZoom{0%{transform:scale(1)}100%{transform:scale(1.05)}}
.a-hero-scrim{background:linear-gradient(100deg,#05090f 30%,rgba(5,9,15,.9) 52%,rgba(5,9,15,.55) 76%,rgba(5,9,15,.28) 100%),linear-gradient(0deg,#05090f 0%,rgba(5,9,15,0) 24%)}
.a-hero-grid{padding:84px 0 72px}
.a-hero-copy{max-width:620px;animation:none}
.a-hero-copy>*{animation:acRise .8s var(--ease) both}
.a-hero-copy>*:nth-child(2){animation-delay:.07s}
.a-hero-copy>*:nth-child(3){animation-delay:.14s}
.a-hero-copy>*:nth-child(4){animation-delay:.22s}
.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border:1px solid rgba(48,214,139,.25);border-radius:999px;background:rgba(48,214,139,.1);color:var(--green);font-size:10.5px;letter-spacing:.14em;margin-bottom:20px}
.eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 0 0 currentColor;animation:acPulse 2s ease-out infinite}
.a-hero h1{font-size:clamp(38px,6vw,64px);letter-spacing:-.04em;line-height:1.02;margin-bottom:18px}
.a-hero h1 em{font-style:normal;background:linear-gradient(120deg,#5df0b0,#30d68b 55%,#7fb6ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.a-hero p{font-size:17px;line-height:1.6;color:#b9c7d6;max-width:520px;margin-bottom:28px}
.hero-card{display:flex;align-items:center;gap:16px;max-width:560px;padding:14px 14px 14px 16px;border:1px solid var(--hair-strong);border-radius:20px;background:rgba(14,22,36,.62);backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%);box-shadow:var(--lift)}
.ring{position:relative;flex:none;width:56px;height:56px;display:grid;place-items:center}
.ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:5}
.ring-bg{stroke:rgba(255,255,255,.1)}
.ring-fg{stroke:var(--green);stroke-linecap:round;stroke-dasharray:170;stroke-dashoffset:170;transition:stroke-dashoffset 1s var(--ease);filter:drop-shadow(0 0 5px rgba(48,214,139,.6))}
.ring span{font-family:'JetBrains Mono',monospace;font-size:11.5px;font-weight:600;color:var(--text)}
.hero-card-mid{flex:1;min-width:0;display:grid;gap:9px}
.progress-row{max-width:none}
.progress-lbl{font-family:'DM Sans',system-ui,sans-serif;font-size:13.5px;font-weight:500;color:#dbe5ef;white-space:normal}
.progress-track{height:6px;background:rgba(255,255,255,.1)}
.progress-fill{background:linear-gradient(90deg,#30d68b,#5df0b0);transition:width 1s var(--ease)}
.resume-btn{flex:none;border:0;border-radius:14px;padding:13px 18px;background:linear-gradient(180deg,#3fe59c,#24c47c);color:#04140c;font:700 14px 'Bricolage Grotesque',system-ui,sans-serif;cursor:pointer;white-space:nowrap;box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 10px 24px -12px rgba(48,214,139,.9);transition:transform .25s var(--ease),filter .25s var(--ease)}
.resume-btn:hover{transform:translateY(-1px);filter:brightness(1.07)}
.resume-btn:active{transform:scale(.97)}

/* ── How it works ───────────────────────────────────────── */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:28px 0 0;position:relative}
.step{display:flex;gap:14px;align-items:flex-start;padding:18px;border:1px solid var(--hair);border-radius:18px;background:var(--surface),var(--solid);box-shadow:var(--lift)}
.step-n{flex:none;width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:rgba(48,214,139,.13);border:1px solid rgba(48,214,139,.3);color:var(--green);font:600 13px 'JetBrains Mono',monospace}
.step h3{font:700 15.5px 'Bricolage Grotesque',system-ui,sans-serif;letter-spacing:-.01em;margin-bottom:4px;color:var(--text)}
.step p{font-size:13.5px;line-height:1.55;color:var(--muted)}

/* ── Layout ─────────────────────────────────────────────── */
.a-body{grid-template-columns:330px minmax(0,1fr);gap:24px;padding:28px 0 72px}
.side-toggle{display:none}

/* ── Module list ────────────────────────────────────────── */
.side{top:78px;max-height:calc(100vh - 96px);padding-right:6px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.16) transparent}
.side::-webkit-scrollbar{width:8px}
.side::-webkit-scrollbar-thumb{background:rgba(255,255,255,.16);border-radius:8px;border:2px solid transparent;background-clip:content-box}
.mod{margin-bottom:8px;border:1px solid var(--hair);border-radius:16px;background:var(--surface),var(--solid);transition:border-color .3s var(--ease)}
.mod:hover,.mod.open{border-color:var(--hair-strong)}
.mod-head{gap:12px;padding:12px 14px;transition:background-color .25s var(--ease)}
.mod-head:hover{background:rgba(255,255,255,.035)}
.mod-head .mi{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:rgba(255,255,255,.06);font-size:16px}
.mt-wrap{flex:1;min-width:0;display:grid;gap:2px}
.mk{font:500 9.5px 'JetBrains Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:#7689a0}
.mod-head .mt{font-size:13.5px;line-height:1.25;letter-spacing:-.01em}
.mod-head .mc{padding:3px 8px;border-radius:999px;background:rgba(255,255,255,.07);color:#a9b9ca;font-size:10px;transition:background-color .4s var(--ease),color .4s var(--ease)}
.mod.complete .mc{background:rgba(48,214,139,.16);color:var(--green)}
.mod.complete .mi{background:rgba(48,214,139,.14)}
.mod-head .chev{font-size:11px;color:#7689a0;transition:transform .45s var(--ease),color .25s var(--ease)}
.mod.open .chev{transform:rotate(90deg);color:var(--green)}
.mod-lessons,.mod.open .mod-lessons{display:grid;border-top:0;grid-template-rows:0fr;transition:grid-template-rows .5s var(--ease)}
.mod.open .mod-lessons{grid-template-rows:1fr}
.mod-lessons-in{min-height:0;overflow:hidden;opacity:0;transition:opacity .35s ease}
.mod.open .mod-lessons-in{opacity:1;border-top:1px solid var(--hair);padding:6px}
.lesson-link{gap:11px;padding:9px 10px;border:0;border-radius:10px;font-size:13px;line-height:1.35;color:#a9b9ca;transition:background-color .25s var(--ease),color .25s var(--ease),transform .25s var(--ease)}
.lesson-link:hover{background:rgba(255,255,255,.06);color:#fff}
.lesson-link:active{transform:scale(.985)}
.lesson-link.active{background:rgba(48,214,139,.13);color:#fff;font-weight:500}
.lesson-link .dot{width:17px;height:17px;border:1.5px solid rgba(255,255,255,.22);font-size:10px;font-weight:700;transition:background-color .4s var(--ease),border-color .4s var(--ease),transform .5s var(--ease)}
.lesson-link.done .dot{background:var(--green);border-color:var(--green);color:#04140c;transform:scale(1.05)}
.lesson-link.done{color:#8fa1b5}
.lesson-link.done.active{color:#fff}
.side-cta{margin-top:12px;padding:16px;border:1px solid var(--hair);border-radius:16px;background:var(--surface),var(--solid)}
.side-cta p{color:#b9c7d6;font-size:13px}
.side-cta a{padding:10px;border-radius:11px;background:rgba(255,255,255,.07);color:#fff;font-size:13px;transition:background-color .25s var(--ease),transform .25s var(--ease)}
.side-cta a:first-of-type{background:linear-gradient(180deg,#3fe59c,#24c47c);color:#04140c}
.side-cta a:hover{background:rgba(255,255,255,.13)}
.side-cta a:first-of-type:hover{background:linear-gradient(180deg,#55eeaa,#2bd086)}
.side-cta a:active{transform:scale(.98)}

/* ── Lesson reader ──────────────────────────────────────── */
.pane{padding:36px 44px 32px;border:1px solid var(--hair);border-radius:22px;background:var(--surface),var(--solid);backdrop-filter:none;box-shadow:var(--lift);scroll-margin-top:76px}
.pane.swap>*{animation:acRise .6s var(--ease) both}
.pane.swap>*:nth-child(2){animation-delay:.04s}
.pane.swap>*:nth-child(3){animation-delay:.08s}
.pane.swap>*:nth-child(4){animation-delay:.12s}
.pane.swap>*:nth-child(n+5){animation-delay:.16s}
.pane-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.pane-mod{margin:0;color:var(--green);letter-spacing:.1em}
.pane p.pane-mod{font-size:10.5px;margin-bottom:0}
.pane-count{flex:none;padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.07);color:#a9b9ca;font:500 10.5px 'JetBrains Mono',monospace}
.pane h2{font-size:clamp(26px,3.4vw,36px);letter-spacing:-.035em;line-height:1.1;margin-bottom:14px}
.pane p{font-size:16.5px;line-height:1.75;color:#cfdae6;margin-bottom:18px;max-width:68ch;overflow-wrap:anywhere}
.pane p b,.pane p strong{color:#fff;font-weight:600}
.pane .lesson-permalink{padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.06);margin:0 0 22px!important;transition:background-color .25s var(--ease)}
.pane .lesson-permalink:hover{background:rgba(255,255,255,.11)}
.lesson-img,.lesson-video{margin:6px 0 24px;border:1px solid var(--hair);border-radius:16px;background:#0a111c;box-shadow:0 20px 40px -28px rgba(0,0,0,.9)}
.video-credit{font-size:12px!important;color:#7689a0!important;margin:-14px 0 22px!important}
.takeaway,.example-box,.try-box,.mod-cta{border-radius:16px;border:1px solid var(--hair)}
.takeaway{margin:28px 0 10px;padding:18px 20px;background:rgba(48,214,139,.09);border-color:rgba(48,214,139,.26)}
.takeaway .tk-lbl,.ex-lbl{font-size:10px;letter-spacing:.12em;margin-bottom:8px}
.takeaway p{font-size:15.5px;color:#eaf6ef}
.example-box{margin:0 0 22px;padding:16px 20px;background:rgba(255,255,255,.04)}
.try-box{margin:14px 0 0;padding:16px 20px;background:rgba(230,189,90,.08);border-color:rgba(230,189,90,.26)}
.try-box .ex-lbl{color:var(--gold)}
.example-box p,.try-box p{font-size:15px;line-height:1.65}
.mod-cta{margin-top:20px;padding:16px 18px;background:rgba(230,189,90,.08);border-color:rgba(230,189,90,.26);animation:acRise .6s var(--ease) both}
.mod-cta a{border-radius:11px;background:var(--gold)}
.pane-actions{margin-top:30px;padding-top:22px;border-top:1px solid var(--hair)}
.done-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 20px;border:1px solid rgba(48,214,139,.5);border-radius:13px;color:var(--green);font-size:14px;transition:background-color .3s var(--ease),color .3s var(--ease),transform .25s var(--ease),box-shadow .3s var(--ease)}
.done-btn:hover{background:rgba(48,214,139,.12)}
.done-btn:active,.nb:active{transform:scale(.97)}
.done-btn.is-done{border-color:transparent;background:linear-gradient(180deg,#3fe59c,#24c47c);color:#04140c;box-shadow:0 10px 24px -14px rgba(48,214,139,.9)}
.done-btn.pop{animation:acPop .55s var(--ease) both}
.nb{padding:11px 16px;border:1px solid var(--hair);border-radius:13px;background:rgba(255,255,255,.05);color:#cfdae6;font:600 13px 'DM Sans',system-ui,sans-serif;transition:background-color .25s var(--ease),border-color .25s var(--ease),color .25s var(--ease),transform .25s var(--ease)}
.nb:hover{background:rgba(255,255,255,.1);border-color:var(--hair-strong);color:#fff}
.nb.nb-primary{border-color:transparent;background:#fff;color:#05090f}
.nb.nb-primary:hover{background:#e9eef4;color:#05090f}
.nb:disabled{opacity:.3}

/* ── Sections below the course ──────────────────────────── */
.grad-sec,.share-sec,.brok,.tcard,.a-cta{border:1px solid var(--hair);border-radius:22px;background:var(--surface),var(--solid);box-shadow:var(--lift)}
.grad-sec{padding:32px 36px;margin-bottom:48px;border-color:rgba(230,189,90,.24);background:linear-gradient(180deg,rgba(230,189,90,.09),rgba(230,189,90,.02)),var(--solid)}
.grad-sec .gy,.share-sec .gy,.a-cta .ey{font-size:10.5px;letter-spacing:.14em}
.grad-sec h3,.share-sec h3{font-size:24px;letter-spacing:-.03em}
.grad-sec p,.share-sec p{font-size:15px;color:#c3d0dd}
.grad-form input,.share-form input,.share-form textarea{background:rgba(255,255,255,.05);border:1px solid var(--hair);border-radius:12px;padding:13px 14px;font-size:16px;transition:border-color .25s var(--ease),box-shadow .25s var(--ease),background-color .25s var(--ease)}
.grad-form input:focus{border-color:rgba(230,189,90,.7);box-shadow:0 0 0 4px rgba(230,189,90,.14);background:rgba(255,255,255,.07)}
.share-form input:focus,.share-form textarea:focus{border-color:rgba(48,214,139,.65);box-shadow:0 0 0 4px rgba(48,214,139,.13);background:rgba(255,255,255,.07)}
.grad-btn,.share-btn,.cta-btn,.brok .btn-g{border-radius:13px;transition:transform .25s var(--ease),filter .25s var(--ease)}
.grad-btn:hover:not(:disabled),.share-btn:hover:not(:disabled),.cta-btn:hover,.brok .btn-g:hover{transform:translateY(-1px);filter:brightness(1.07)}
.grad-btn:active,.share-btn:active,.cta-btn:active,.brok .btn-g:active{transform:scale(.97)}
.locked-row{padding:12px 14px;border:1px solid var(--hair);border-radius:12px;background:rgba(255,255,255,.04);font-size:12.5px;color:#a9b9ca}
.cert-preview{border-radius:14px;border:1px solid var(--hair);box-shadow:0 30px 60px -30px rgba(0,0,0,.9)}
.exam-q{border-bottom:1px solid var(--hair)}
.exam-q .qn{font-size:15px;line-height:1.5}
.exam-opt{padding:12px 14px;border:1px solid var(--hair);border-radius:12px;background:rgba(255,255,255,.03);font-size:14.5px;transition:background-color .25s var(--ease),border-color .25s var(--ease),transform .2s var(--ease)}
.exam-opt:hover{border-color:var(--hair-strong);background:rgba(255,255,255,.06)}
.exam-opt:active{transform:scale(.99)}
.exam-opt.sel{border-color:rgba(230,189,90,.7);background:rgba(230,189,90,.1)}
.exam-result{border-radius:14px;animation:acRise .6s var(--ease) both}
.follow-item{border:1px solid var(--hair);border-radius:12px;background:rgba(255,255,255,.04)}
.brokers-sec,.testi-sec{padding:0 0 48px}
.brokers-sec h2,.testi-sec h2{font-size:28px;letter-spacing:-.035em;margin-bottom:8px}
.brokers-sec .sub,.testi-sec .sub{font-size:15px;color:var(--muted)}
.brokers,.tcards{gap:14px}
.brok,.tcard{padding:26px;transition:transform .4s var(--ease),border-color .4s var(--ease)}
.brok:hover,.tcard:hover{transform:translateY(-3px);border-color:var(--hair-strong)}
.brok .bn{font-size:22px;letter-spacing:-.03em}
.brok .specs{gap:10px}
.brok .specs>div{flex:1;min-width:92px;padding:10px 12px;border:1px solid var(--hair);border-radius:12px;background:rgba(255,255,255,.03)}
.tq{font-style:normal;font-size:15px;line-height:1.65;color:#e6edf5}
.tempty{border:1px dashed var(--hair-strong);border-radius:18px}
.share-sec{padding:32px 36px;margin-bottom:48px;border-color:rgba(48,214,139,.2);background:linear-gradient(180deg,rgba(48,214,139,.07),rgba(48,214,139,.015)),var(--solid)}
.share-ok{border-radius:14px}
.a-cta{padding:48px 36px;margin-bottom:56px;border-color:rgba(48,214,139,.22);background:radial-gradient(600px 260px at 50% 0%,rgba(48,214,139,.16),transparent 70%),var(--solid)}
.a-cta::before{display:none}
.a-cta h3{font-size:clamp(24px,3.4vw,32px);letter-spacing:-.035em}
.a-cta p{font-size:15.5px;color:#b9c7d6}
footer{background:transparent;border-top:1px solid var(--hair)}
.foot-copy{border-top:1px solid var(--hair)}

/* ── Motion ─────────────────────────────────────────────── */
@keyframes acRise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes acFade{from{opacity:0}to{opacity:1}}
@keyframes acPop{0%{transform:scale(.9)}55%{transform:scale(1.06)}100%{transform:scale(1)}}
@keyframes acPulse{0%{box-shadow:0 0 0 0 rgba(48,214,139,.6)}100%{box-shadow:0 0 0 8px rgba(48,214,139,0)}}
.reveal{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease),transform .8s var(--ease),border-color .4s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* ── Phones and tablets ─────────────────────────────────── */
@media(max-width:900px){
  .wrap{padding:0 18px}
  .a-hero-grid{padding:48px 0 40px}
  .a-hero-scrim{background:linear-gradient(180deg,rgba(5,9,15,.55) 0%,rgba(5,9,15,.88) 58%,#05090f 100%)}
  .steps{grid-template-columns:1fr;gap:10px;margin-top:20px}
  .a-body{grid-template-columns:1fr;gap:12px;padding:20px 0 56px}
  /* The lesson list folds behind one button so the lesson itself comes first on a phone. */
  .side-toggle{display:flex;align-items:center;gap:10px;width:100%;padding:14px 16px;border:1px solid var(--hair-strong);border-radius:16px;background:var(--surface),var(--solid);color:var(--text);font:700 14.5px 'Bricolage Grotesque',system-ui,sans-serif;text-align:left;cursor:pointer;box-shadow:var(--lift)}
  .side-toggle .st-main{flex:none}
  .side-toggle .st-sub{flex:1;min-width:0;color:#8fa1b5;font:500 11px 'JetBrains Mono',monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .side-toggle svg{flex:none;color:var(--green);transition:transform .45s var(--ease)}
  .side-open .side-toggle svg{transform:rotate(180deg)}
  .side{position:static;max-height:none;padding-right:0;display:none}
  .side-open .side{display:block;animation:acRise .5s var(--ease) both}
  .pane{padding:26px 20px 24px;border-radius:20px}
  .pane p{font-size:16px}
  .pane-actions{flex-direction:column;align-items:stretch}
  .done-btn{justify-content:center}
  .nav-btns{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .nb{text-align:center}
  .grad-sec,.share-sec{padding:24px 20px}
  .a-cta{padding:36px 20px}
  .a-cta .cta-btn{width:100%;justify-content:center}
  .grad-form,.share-form{flex-direction:column}
  .grad-form input{min-width:0}
  .grad-btn,.share-btn{width:100%;align-self:stretch}
}
@media(max-width:560px){
  .logo-name{font-size:15px}
  .hero-card{flex-wrap:wrap;gap:12px 14px;padding:14px}
  .resume-btn{flex:1 1 100%;text-align:center}
  .pane-top{flex-wrap:wrap}
  .brok .specs>div{min-width:0}
  .foot-inner,.foot-links{flex-wrap:wrap;gap:12px 18px}
}

/* Reduced motion: nothing slides, zooms or loops, but things still fade in. */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  @keyframes acRise{from{opacity:0}to{opacity:1}}
  @keyframes acPop{from{opacity:.6}to{opacity:1}}
  .eyebrow::before{animation:none}
  .reveal{transform:none}
  .a-hero-copy>*{animation:acFade .6s ease both}
  .brok:hover,.tcard:hover,.resume-btn:hover{transform:none}
}

/* Hero alignment: the hero is a flex row, so its .wrap must be told to span the full width or
   it shrinks around the copy and drifts to the centre. */
.a-hero>.wrap{width:100%}
.a-hero p.eyebrow{font-size:10.5px;line-height:1;max-width:none;margin-bottom:20px}
.mod-head .chev{font-size:13px}
.pane .example-box p,.pane .try-box p,.pane .takeaway p,.pane .mod-cta p{margin-bottom:0}

/* Line icons replace emoji everywhere on the page. */
.ico{display:inline-block;width:1.05em;height:1.05em;vertical-align:-.16em;flex:none}
.mod-head .mi{color:var(--green)}
.mod-head .mi .ico{width:17px;height:17px;vertical-align:0}
.lesson-link .dot .ico{width:10px;height:10px;stroke-width:3.5;vertical-align:0}
.grad-sec .gy,.share-sec .gy,.kairos-sec .gy{display:flex;align-items:center;gap:7px}
.ex-lbl{display:flex;align-items:center;gap:6px}
.locked-row .ico{color:var(--gold)}
.exam-result .ico{margin-right:4px}
.grad-btn .ico{margin-right:4px}

/* Kairos section */
.kairos-sec{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:28px 40px;align-items:center;margin:0 0 48px;padding:34px 36px;border:1px solid rgba(64,132,255,.24);border-radius:22px;background:radial-gradient(520px 260px at 0% 0%,rgba(64,132,255,.16),transparent 70%),radial-gradient(520px 260px at 100% 100%,rgba(48,214,139,.12),transparent 70%),var(--solid);box-shadow:var(--lift);scroll-margin-top:80px}
.kairos-sec-logo{width:100%;height:auto;mix-blend-mode:screen}
.kairos-sec .gy{font:600 10.5px 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:#7fb6ff;margin-bottom:10px}
.kairos-sec h3{font:800 clamp(22px,3vw,28px)/1.15 'Bricolage Grotesque',system-ui,sans-serif;letter-spacing:-.035em;color:var(--text);margin-bottom:10px}
.kairos-sec p{font-size:15.5px;line-height:1.65;color:#c3d0dd;max-width:52ch}
.kairos-sec-btns{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0 14px}
.kairos-sec .cta-btn{padding:12px 20px;font-size:14px}
.kairos-sec .cta-btn.ghost{background:rgba(255,255,255,.07);border:1px solid var(--hair);color:#fff}
.kairos-sec p.kairos-sec-note{font:500 11.5px 'JetBrains Mono',monospace;color:#7689a0}
@media(max-width:760px){.kairos-sec{grid-template-columns:1fr;padding:26px 20px;text-align:left}.kairos-sec-logo{max-width:240px;margin:0 auto}.kairos-sec .cta-btn{flex:1;justify-content:center}}
.mod-head .chev{display:grid;place-items:center}
.mod-head .chev .ico{width:14px;height:14px;vertical-align:0}
.tstars{display:flex;gap:3px;letter-spacing:0}
.tstars .ico{width:14px;height:14px}