/* Undecided Academy — tokens from ~/.claude/skills/undecided-design/tokens */
/* Fonts — self-hosted (PodcastSitePerf, 2026-10-06). Were loaded from fonts.bunny.net, a
   render-blocking stylesheet on another host. Files from fonts.bunny.net (Titillium Web and
   Roboto, SIL Open Font License). Only the subset a page needs is downloaded (unicode-range). */
@font-face{font-family:"Titillium Web";font-style:normal;font-weight:300;font-display:swap;src:url("../fonts/titillium-web-latin-300-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Titillium Web";font-style:normal;font-weight:300;font-display:swap;src:url("../fonts/titillium-web-latin-ext-300-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Titillium Web";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/titillium-web-latin-700-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Titillium Web";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/titillium-web-latin-ext-700-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Titillium Web";font-style:normal;font-weight:900;font-display:swap;src:url("../fonts/titillium-web-latin-900-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Titillium Web";font-style:normal;font-weight:900;font-display:swap;src:url("../fonts/titillium-web-latin-ext-900-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Roboto";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/roboto-latin-400-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Roboto";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/roboto-latin-ext-400-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Roboto";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/roboto-latin-500-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Roboto";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/roboto-latin-ext-500-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Roboto";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/roboto-latin-700-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Roboto";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/roboto-latin-ext-700-normal.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{
  --color-blue:#4593D3;--blue-700:#2E6FA8;--blue-600:#3A82C2;--blue-200:#B6D5EE;--blue-100:#E3F0FA;
  --gray-900:#111;--gray-800:#1D1D1D;--gray-600:#666;--gray-400:#999;--gray-300:#CCC;--gray-200:#E2E2E2;--gray-100:#F2F2F2;--gray-50:#F8F8F8;
  --text-primary:#000;--text-secondary:#666;--text-link:var(--color-blue);--text-link-hover:var(--blue-700);
  --surface-page:#fff;--surface-muted:var(--gray-100);--border:var(--gray-200);
  --font-display:"Titillium Web",system-ui,sans-serif;--font-body:Roboto,system-ui,sans-serif;
  --radius:8px;--shadow-sm:0 1px 2px rgba(0,0,0,.06),0 1px 3px rgba(0,0,0,.08);--shadow-lg:0 12px 24px rgba(0,0,0,.10);
  --ease:cubic-bezier(.2,0,0,1);--focus:0 0 0 3px var(--blue-200);
  --space-1:8px;--space-2:16px;--space-3:24px;--space-4:32px;--space-6:48px;--space-8:64px;
  --content-max:1200px;--reading-max:720px;--nav-w:320px;
}
*{box-sizing:border-box}
/* hidden must beat any display rule (e.g. .btn is inline-block), or "Mark as done" stays visible after it's done. */
[hidden]{display:none!important}
html{font-family:var(--font-body);color:var(--text-primary);background:var(--surface-page);-webkit-font-smoothing:antialiased}
body{margin:0;line-height:1.6;font-size:18px}
a{color:var(--text-link)}a:hover{color:var(--text-link-hover)}
h1,h2,h3{font-family:var(--font-display);font-weight:700;line-height:1.15;margin:0 0 var(--space-2)}
h1{font-size:clamp(30px,4.5vw,44px)}h2{font-size:26px}
img{max-width:100%;height:auto;display:block}
:focus-visible{outline:none;box-shadow:var(--focus);border-radius:6px}
/* Visually hidden, still read by screen readers. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}

/* header / footer */
.site-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);max-width:var(--content-max);margin:0 auto;padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--border)}
.site-header__logo{display:flex;align-items:center;gap:var(--space-1);text-decoration:none;color:inherit}
.site-header__logo img{width:180px;height:auto}
.site-header__wordmark{font-family:var(--font-display);font-weight:300;font-size:22px;letter-spacing:.02em;padding-left:var(--space-1);border-left:1px solid var(--gray-300)}
.site-header__nav{display:flex;gap:var(--space-3)}
.site-header__nav a{color:var(--text-primary);text-decoration:none;font-weight:500}
.site-header__nav a:hover{color:var(--color-blue)}
@media (max-width:600px){
  .site-header{flex-wrap:wrap;row-gap:var(--space-1)}
  .site-header__logo img{width:140px}
  .site-header__nav{flex-basis:100%;justify-content:flex-start}
}
.site-footer{max-width:var(--content-max);margin:var(--space-8) auto 0;padding:var(--space-3);border-top:1px solid var(--border);color:var(--text-secondary);font-size:14px}
.site-footer p{margin:0 0 var(--space-1)}
.site-footer__links{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.site-footer__links a{color:var(--text-secondary)}
.site-footer__links a:hover{color:var(--color-blue)}
/* Termly draws its policies with its own styles; give the embed room */
.page__body [name="termly-embed"]{min-height:60vh}
/* Policy pages: plain tables and code names (the Cookie Policy's cookie list). */
.page__body table{width:100%;border-collapse:collapse;margin:0 0 var(--space-3);font-size:16px}
.page__body th,.page__body td{text-align:left;vertical-align:top;padding:var(--space-1) 12px;border-bottom:1px solid var(--border)}
.page__body th{font-family:var(--font-display);font-weight:700;background:var(--gray-50)}
.page__body td code{white-space:nowrap}
.page__body code{font-size:.9em;background:var(--gray-100);padding:1px 5px;border-radius:4px}

/* catalog + plain pages */
.catalog,.page{max-width:var(--content-max);margin:0 auto;padding:var(--space-6) var(--space-3)}
.page__body{max-width:var(--reading-max)}
.catalog__list{list-style:none;padding:0;margin:0;display:grid;gap:var(--space-3);grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm);overflow:hidden;transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.catalog__item h2,.catalog__item p{padding:0 var(--space-2)}
.catalog__item h2{margin-top:var(--space-2)}
.catalog__item p{color:var(--text-secondary);padding-bottom:var(--space-2)}

/* buttons */
.btn,.academy-buy,.academy-go{display:inline-block;font:500 16px var(--font-body);padding:12px 20px;border-radius:8px;border:1px solid transparent;cursor:pointer;text-decoration:none;transition:background .15s var(--ease),transform .12s var(--ease)}
.academy-buy,.academy-go{background:var(--color-blue);color:#fff}.academy-buy:hover,.academy-go:hover{background:var(--blue-600);color:#fff}
.btn--secondary{background:#fff;border-color:var(--gray-300);color:var(--text-primary)}.btn--secondary:hover{background:var(--gray-100)}
.btn:active,.academy-buy:active,.academy-go:active{transform:scale(.98)}

/* course layout: nav left, content right */
.course{display:grid;grid-template-columns:var(--nav-w) minmax(0,1fr);gap:var(--space-6);max-width:var(--content-max);margin:0 auto;padding:var(--space-4) var(--space-3)}
.course__main{max-width:var(--reading-max)}
.course__lede{font-size:18px;color:var(--text-secondary)}
@media (max-width:900px){.course{grid-template-columns:1fr}.course-nav{order:2}}

/* lesson status circle + lesson-type icon (shared by the side-nav and the course dashboard) */
.lesson-tick{display:inline-block;flex:0 0 22px;width:22px;height:22px;border-radius:50%;border:2px solid var(--color-blue);box-sizing:border-box;background:#fff}
.is-started .lesson-tick,.is-current .lesson-tick,.is-next .lesson-tick{background:linear-gradient(90deg,var(--color-blue) 50%,#fff 50%)}
.is-done .lesson-tick,.lesson-tick--done{border-color:var(--color-blue);background:var(--color-blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.5l2.5 2.5 4.5-5' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px 12px no-repeat}
.lesson-icon{display:inline-block;width:18px;height:14px;margin-right:8px;vertical-align:-1px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 14'%3E%3Cpath d='M2 2h14M2 7h14M2 12h9' fill='none' stroke='%23444' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat}
.has-video .lesson-icon{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 14'%3E%3Crect x='1' y='1' width='16' height='10' rx='1.2' fill='none' stroke='%23444' stroke-width='1.6'/%3E%3Cpath d='M7.4 3.6v4.8L11.4 6z' fill='%23444'/%3E%3Cpath d='M6 13.2h6' stroke='%23444' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E")}

/* side-nav: full-width rows, a narrow status column, pale blue for the current row and on hover */
.course-nav{position:sticky;top:var(--space-2);align-self:start;max-height:calc(100vh - var(--space-4));overflow:auto;border:1px solid var(--border);border-radius:var(--radius);background:var(--gray-50)}
.course-nav__head{padding:var(--space-2)}
.course-nav__bar{height:6px;border-radius:3px;background:var(--gray-200);overflow:hidden}
.course-nav__bar span{display:block;height:100%;width:0;background:var(--color-blue);transition:width .28s var(--ease)}
.course-nav__count{margin:var(--space-1) 0 0;font-size:14px;color:var(--text-secondary)}
.course-nav__note{font-size:13px;color:var(--text-secondary);margin:4px 0 0}
.course-nav__empty{font-size:13px;color:var(--text-secondary);margin:0;padding:var(--space-2)}
.course-nav__list{list-style:none;margin:0;padding:0}
.course-nav__item{border-top:1px solid var(--border)}
.course-nav__link{display:flex;align-items:stretch;color:inherit;text-decoration:none}
.course-nav__status{flex:0 0 52px;display:flex;align-items:center;justify-content:center;border-right:1px solid var(--border)}
.course-nav__body{flex:1 1 auto;min-width:0;padding:14px 12px;font-size:16px;line-height:1.4}
.course-nav__link:hover,.course-nav__item.is-current .course-nav__link{background:var(--blue-100)}
.course-nav__link:hover .lesson-tick{border-color:var(--blue-700)}
.course-nav__title{font-weight:500}
.course-nav__item.is-done .course-nav__title{color:var(--text-secondary)}
/* in the nav the duration follows the title in brackets and the summary is left out */
.course-nav .lesson-meta{display:inline;margin:0 0 0 4px;font-size:inherit}
.course-nav .lesson-meta__duration{font-weight:400;color:var(--text-secondary);margin:0;white-space:nowrap}
.course-nav .lesson-meta__duration::before{content:"("}.course-nav .lesson-meta__duration::after{content:")"}
.course-nav .lesson-meta__summary{display:none}
.lesson-meta{margin:2px 0 0;font-size:13px;color:var(--text-secondary);line-height:1.4}
.lesson-meta__duration{font-weight:500;color:var(--text-primary);margin-right:6px}

/* course dashboard (page-course.hbs) */
.course-dash{max-width:var(--content-max);margin:0 auto;padding:var(--space-4) var(--space-3)}
.course-dash__title{margin-bottom:var(--space-3)}
.dash-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:var(--space-3)}
.dash-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-3);align-items:stretch;margin-bottom:var(--space-3)}
.dash-hero__image{width:100%;height:100%;max-height:340px;object-fit:cover;border-radius:var(--radius)}
.dash-hero__next{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:var(--gray-50);border-radius:var(--radius);padding:var(--space-4) var(--space-3);min-height:220px}
.dash-hero__count{margin:0 0 var(--space-1);color:var(--text-secondary)}
.dash-hero__lesson{font-size:30px;margin:0 0 var(--space-3)}
.dash-hero__btn{font-size:18px;padding:14px 32px}
.dash-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:var(--space-3);align-items:start}
.dash-side{display:grid;gap:var(--space-3)}
.dash-lessons__head h2{margin:0 0 4px;font-size:22px}
.dash-lessons__head p{margin:0 0 var(--space-2);color:var(--text-secondary)}
.dash-lessons__list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
/* every row carries a 5px left border (clear by default) so the blue one on the next lesson doesn't shift the text */
.dash-row{display:flex;align-items:center;gap:var(--space-2);padding:12px var(--space-2) 12px calc(var(--space-2) - 5px);background:var(--gray-50);border-left:5px solid transparent}
.dash-row.is-next{border-left-color:var(--color-blue)}
.dash-row__body{flex:1 1 auto;min-width:0}
.dash-row__title{display:block;color:inherit;text-decoration:none;font-weight:500}
.dash-row__title:hover{color:var(--color-blue)}
.dash-row.is-done .dash-row__title{color:var(--text-secondary)}
.dash-row__meta{display:flex;align-items:baseline;margin-top:2px}
.dash-row__meta .lesson-icon{flex:0 0 18px;align-self:center}
.dash-row__meta .lesson-meta{margin:0;font-size:14px}
.dash-row__btn{flex:0 0 auto;padding:8px 16px;font-size:15px;min-width:84px;text-align:center}
.dash-progress{text-align:center}
.dash-progress__pct{font-size:22px;letter-spacing:.04em;text-transform:uppercase;margin:var(--space-1) 0 var(--space-2)}
.dash-progress__note{margin:var(--space-2) 0 0;font-size:13px;font-style:italic;color:var(--text-secondary)}
.dash-matt__head{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-2)}
.dash-matt__photo{width:96px;height:96px;border-radius:50%;object-fit:cover}
.dash-matt__name{margin:0;font-size:22px}
.dash-matt p{margin:0;font-size:16px}
@media (max-width:900px){.dash-hero,.dash-grid{grid-template-columns:1fr}}
@media (max-width:560px){.dash-row{flex-wrap:wrap}.dash-row__btn{margin-left:38px}}

/* lesson */
.lesson__course{font-family:var(--font-display);font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;text-decoration:none}
.lesson__header .lesson-meta{font-size:15px;margin:var(--space-1) 0 var(--space-3)}
.lesson-video{position:relative;aspect-ratio:16/9;background:#000;border-radius:var(--radius);overflow:hidden;margin-bottom:var(--space-3)}
.lesson-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.lesson__actions{display:flex;align-items:center;gap:var(--space-2);margin:var(--space-3) 0}
.lesson__done-note{display:inline-flex;align-items:center;gap:8px;color:var(--text-primary);font-weight:500}
/* Lesson pages and the course home carry the theme's own access-cta above the
   content, so hide the banner Ghost injects into {{content}} here only — not site-wide. */
.lesson__content .gh-post-upgrade-cta,.course__intro .gh-post-upgrade-cta{display:none}
.course__intro{margin-bottom:var(--space-3)}
.lesson__comments{border-top:1px solid var(--border);margin-top:var(--space-3);padding-top:var(--space-3)}
.lesson__comments-title{font-size:26px;margin-bottom:var(--space-2)}
.lesson__nav{display:flex;justify-content:space-between;gap:var(--space-3);border-top:1px solid var(--border);padding-top:var(--space-2)}
.lesson__nav a{display:flex;align-items:flex-start;gap:8px;max-width:48%}
.lesson__next{margin-left:auto;text-align:right}
/* underline the title only, never the arrow */
.lesson__nav a{text-decoration:none}
.lesson__nav a span:not(.lesson__arrow){text-decoration:underline}
.lesson__arrow{flex:0 0 auto}
@media (max-width:560px){.lesson__nav{flex-direction:column}.lesson__nav a{max-width:none}.lesson__next{margin-left:0;justify-content:flex-end}}

/* access CTA — shown above gated content when the visitor can't read it */
.access-cta{border:1px solid var(--blue-200);background:var(--blue-100);border-radius:var(--radius);padding:var(--space-2) var(--space-3);margin:0 0 var(--space-3)}
.access-cta__line{margin:0 0 var(--space-1)}
.access-cta__line:last-child{margin-bottom:0}

/* course landing page — this visitor already owns the course, so the buy CTA
   inside {{content}} is replaced by a link straight into the course */
.page--owned .academy-buy,.page--owned .academy-buy__note{display:none}
/* matches the dashboard's next-lesson panel: grey ground, same radius and button */
.owned-banner{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);border:1px solid var(--border);background:var(--gray-50);border-radius:var(--radius);padding:var(--space-3);margin:0 0 var(--space-3)}

/* course landing (sales) page — page-landing.hbs */
.landing{--gutter:var(--space-3);max-width:var(--content-max);margin:0 auto;padding:var(--space-4) var(--gutter) 0}
.landing-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:var(--space-4);align-items:center;margin-bottom:var(--space-8)}
.landing-hero__image{border-radius:var(--radius);box-shadow:var(--shadow-sm);width:100%}
.landing-hero__title{font-size:clamp(36px,5vw,54px);margin-bottom:var(--space-2)}
.landing-hero__tagline{white-space:pre-line;font-size:19px;color:var(--gray-800);margin:0 0 var(--space-3)}
.landing-hero__tagline::first-line{font-family:var(--font-display);font-weight:700;font-size:22px}
.landing-hero__cta{font-size:18px;padding:14px 28px}
.landing-hero .owned-banner{margin-bottom:var(--space-2)}
@media (max-width:800px){.landing-hero{grid-template-columns:1fr}}
/* Every body block sits in the centred reading column; !important so a block's own margin shorthand can't pull it left. */
.landing__body>*{max-width:var(--reading-max);margin-left:auto!important;margin-right:auto!important}
.landing__body h2,.landing-section__title{font-size:32px;text-align:center;margin-bottom:var(--space-3)}
.landing__body .kg-image-card{margin:var(--space-3) 0}
.testimonial{margin:0 0 var(--space-2);padding:var(--space-2) var(--space-3);border-left:3px solid var(--color-blue);background:var(--gray-50);border-radius:0 var(--radius) var(--radius) 0}
.testimonial blockquote{margin:0;font-style:italic}
.testimonial figcaption{margin-top:var(--space-1);font-weight:500;color:var(--text-secondary)}
.landing-video{position:relative;aspect-ratio:16/9;background:var(--gray-900);border-radius:var(--radius);overflow:hidden;margin:var(--space-3) 0}
.landing-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.landing-video__note{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;margin:0;color:#fff;font-family:var(--font-display);font-weight:700;font-size:20px}
.landing__body>.buy-card{max-width:none;margin:var(--space-6) calc(-1 * var(--gutter))!important}
.buy-card{scroll-margin-top:var(--space-3);text-align:center;background:var(--gray-50);padding:var(--space-6) var(--gutter)}
.buy-card>*{max-width:var(--reading-max);margin-left:auto;margin-right:auto}
.buy-card__title{font-size:32px;margin:0 auto var(--space-3)}
.buy-card__price{font-family:var(--font-display);font-weight:900;font-size:48px;line-height:1;margin:0 auto var(--space-1)}
.buy-card__label{margin:0 auto var(--space-2);color:var(--text-secondary)}
.buy-card .academy-buy{font-size:18px;padding:14px 28px}
.buy-card .academy-buy__note{margin:var(--space-2) auto 0;font-size:14px;color:var(--text-secondary)}
.page--owned .landing-hero__cta,.page--owned .landing-lessons__cta,.page--owned .buy-card{display:none}
.landing-section{max-width:var(--reading-max);margin:var(--space-8) auto 0}
.landing-lessons__list{list-style:none;margin:0;padding:0;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;counter-reset:lesson}
.landing-lessons__item{border-top:1px solid var(--border)}
.landing-lessons__item:first-child{border-top:0}
.landing-lessons__link{display:flex;gap:var(--space-2);align-items:baseline;padding:12px var(--space-2);color:inherit;text-decoration:none}
.landing-lessons__link:hover{background:var(--gray-50)}
.landing-lessons__link::before{counter-increment:lesson;content:counter(lesson);flex:0 0 30px;height:30px;display:flex;align-items:center;justify-content:center;line-height:1;border-radius:50%;background:var(--blue-100);color:var(--blue-700);font:700 14px var(--font-body);align-self:center}
.landing-lessons__title{font-weight:500;flex:1 1 auto}
.landing-lessons__link .lesson-meta{margin:0;flex:0 0 auto;text-align:right}
.landing-lessons__link .lesson-meta__summary{display:none}
.landing-lessons__cta{text-align:center;margin:var(--space-3) 0 0}
.landing-bio{max-width:var(--content-max);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-4);align-items:center}
.landing-bio .landing-section__title{text-align:left}
.landing-bio__photo{border-radius:var(--radius);width:100%}
@media (max-width:800px){.landing-bio{grid-template-columns:1fr}.landing-bio__photo{order:-1}}
.landing-guarantee{text-align:center;padding:var(--space-4) 0 0}

/* dark circuit backdrop (landing pages): the whole site sheet floats on it */
.has-backdrop{--backdrop:#182641;/* solar-cell blue sampled from the hero photo */background:var(--backdrop) url("../images/circuit-white.svg") repeat}
/* the sheet fills the viewport top to bottom; the footer sits at its foot */
.has-backdrop .site-sheet{background:var(--surface-page);max-width:var(--content-max);margin:0 auto;box-shadow:var(--shadow-lg);min-height:100vh;display:flex;flex-direction:column}
.has-backdrop .site-sheet>main{flex:1 0 auto}
/* inside the column-flex sheet, `margin:0 auto` would shrink-wrap the header/footer: pin them full width */
.has-backdrop .site-header,.has-backdrop .site-footer{max-width:none;width:100%;margin-left:0;margin-right:0}
.has-backdrop .site-footer{margin-top:var(--space-6)}
@media (min-width:801px){.has-backdrop .landing{--gutter:var(--space-8)}.has-backdrop .site-header,.has-backdrop .site-footer{padding-left:var(--space-8);padding-right:var(--space-8)}}
@media (max-width:800px){.has-backdrop .site-sheet{margin:var(--space-2)}}
/* image-left, copy-right block (HTML card in the editor) */
.landing-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-3);align-items:center;margin:var(--space-6) 0}
.landing-split__image{border-radius:var(--radius);width:100%}
.landing-split__copy h2{text-align:left;margin-bottom:var(--space-2)}
@media (max-width:640px){.landing-split{grid-template-columns:1fr}}

/* post-purchase page: one centred column */
.thanks{max-width:var(--content-max);margin:0 auto;padding:var(--space-6) var(--space-3) var(--space-4)}
.thanks__body{max-width:var(--reading-max);margin:0 auto}
.thanks__title{font-size:clamp(32px,4.5vw,44px);text-align:center}
.thanks__body p:has(> .academy-go){text-align:center}
.thanks__body .academy-go{font-size:18px;padding:14px 28px;margin:var(--space-1) 0 var(--space-2)}
@media (min-width:801px){.has-backdrop .thanks{padding-left:var(--space-8);padding-right:var(--space-8)}}

/* Koenig card widths — editor "wide" and "full" cards inside the reading column */
.kg-width-wide{max-width:calc(var(--reading-max) + 160px);width:100%;margin-left:auto;margin-right:auto}
.kg-width-full{max-width:none;width:100%}
.kg-width-wide img,.kg-width-full img{width:100%}

@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* Account box (partials/account-modal.hbs + assets/js/account.js), replacing Portal's account screen. */
.acct{width:calc(100% - 32px);max-width:440px;padding:0;border:0;border-radius:var(--radius);box-shadow:var(--shadow-lg);color:var(--text-primary);font-size:16px}
.acct::backdrop{background:rgba(0,0,0,.5)}
.acct__head{display:flex;align-items:center;justify-content:space-between;padding:20px 24px 0}
.acct__head h2{font-size:24px;margin:0}
.acct__x{border:0;background:none;font-size:28px;line-height:1;color:var(--gray-600);cursor:pointer;padding:4px 6px}
.acct__sec{padding:20px 24px;border-bottom:1px solid var(--border)}
.acct__sec:last-child{border-bottom:0}
.acct__sec h3{font-family:var(--font-display);font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--gray-600);margin:0 0 12px}
.acct__who{display:flex;align-items:center;gap:14px}
.acct__avatar{width:44px;height:44px;border-radius:50%;background:var(--blue-100);color:var(--blue-700);display:grid;place-items:center;font-family:var(--font-display);font-weight:700;font-size:18px;flex:none}
.acct__who-txt{flex:1;min-width:0}
.acct__name{font-weight:500}
.acct__email{color:var(--gray-600);font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acct__link{background:none;border:0;padding:0;font:500 14px var(--font-body);color:var(--color-blue);cursor:pointer}
.acct__link:hover{color:var(--blue-700)}
.acct__link--quiet{color:var(--gray-600);text-decoration:underline}
.acct__notice{margin:14px 0 0;font-size:14px;background:var(--blue-100);border-radius:6px;padding:10px 12px}
.acct__field{display:block;margin-bottom:14px}
.acct__field span{display:block;font-size:14px;font-weight:500;margin-bottom:4px}
.acct__field input{width:100%;font:inherit;padding:9px 12px;border:1px solid var(--gray-300);border-radius:6px}
.acct__field input:focus{outline:none;border-color:var(--color-blue);box-shadow:var(--focus)}
.acct__hint{font-size:13px;color:var(--gray-600);margin:-6px 0 16px}
.acct__error{font-size:14px;color:#B3261E;margin:0 0 12px}
.acct__btns{display:flex;gap:10px}
.acct__btns .btn{padding:9px 18px;font-size:15px}
.acct__course{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--gray-50);border:1px solid var(--border);border-radius:var(--radius);text-decoration:none;color:inherit}
.acct__course+.acct__course{margin-top:8px}
.acct__course:hover{border-color:var(--color-blue);color:inherit}
.acct__course-body{flex:1;min-width:0;display:block}
.acct__course-title{display:block;font-weight:500;line-height:1.3}
.acct__course-meta{display:block;margin-top:4px;font-size:13px;color:var(--gray-600)}
.acct__pill{display:inline-block;font-size:12px;font-weight:500;color:var(--blue-700);background:var(--blue-100);border-radius:999px;padding:1px 9px;margin-right:6px}
.acct__arrow{color:var(--color-blue);font-size:20px;flex:none}
.acct__empty{margin:0;color:var(--gray-600)}
.acct__toggle{display:flex;align-items:flex-start;gap:14px;cursor:pointer;position:relative}
.acct__toggle>span:first-child{flex:1}
.acct__toggle input{position:absolute;opacity:0;right:0;top:0;width:42px;height:24px;margin:0;cursor:pointer}
.acct__switch{position:relative;width:42px;height:24px;flex:none;border-radius:999px;background:var(--gray-300);margin-top:2px;transition:background .15s var(--ease)}
.acct__switch::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:left .15s var(--ease)}
.acct__toggle input:checked+.acct__switch{background:var(--color-blue)}
.acct__toggle input:checked+.acct__switch::after{left:21px}
.acct__toggle input:focus-visible+.acct__switch{box-shadow:var(--focus)}
.acct__toggle input:disabled+.acct__switch{opacity:.5}
.acct__foot{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;font-size:14px;color:var(--gray-600)}
.acct__foot a{color:var(--gray-600)}
