/* Guided workshop hub, adapted from the actual MSX workshop. */
:root{--paper:#f3f0ea;--ink:#14232d;--blue:#2f6f9f;--line:#14232d24}body{background:radial-gradient(ellipse at 95% 0%,#b260450c,transparent 45%),var(--paper)}.wrap{max-width:1220px}.site-nav{border-color:var(--line);padding:22px 0}.wordmark:before{content:'↗';border-radius:7px;background:var(--ink)}.site-nav div a{font-size:11px;padding:8px 0}.site-nav div a:hover{color:var(--blue)}h1,h2,h3{font-weight:700;letter-spacing:-.045em}h1{font-size:clamp(48px,6.5vw,94px);line-height:1.01;text-wrap:balance}h1 strong{color:var(--blue)}.hero{grid-template-columns:1.3fr .7fr;gap:clamp(24px,5vw,80px);align-items:center;padding:clamp(50px,7vw,90px) 0;border:0}.hero .eyebrow{font-size:11px;line-height:1.7;letter-spacing:.08em}.hero .lead{font-size:clamp(18px,1.6vw,23px);color:#5a6973;line-height:1.5;margin-top:24px}.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:24px;margin-top:30px;font-size:14px;font-weight:600}.primary{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;background:var(--ink);color:#fff;padding:17px 24px;border-radius:50px;font-size:14px;font-weight:600}.primary:hover{background:var(--blue)}.hero-aside{border:1px solid var(--line);padding:28px;background:#ffffff70;border-radius:24px;position:relative;transform:rotate(1deg)}.method-label{font:10px var(--mono);letter-spacing:.09em;color:#687782;display:block;margin-bottom:25px}.method-step{display:flex;align-items:center;gap:15px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:17px;font-size:18px}.method-step b{font:15px var(--mono);color:var(--blue)}.method-step strong{display:block}.method-step:nth-of-type(2) b{color:#b26045}.method-step:nth-of-type(3) b{color:#527c67}.method-connector{display:block;color:#768790;padding:4px 24px;font-size:20px}.hero-aside p{font:12px/1.7 var(--mono);max-width:none;margin-top:22px;color:#62717a}.start-strip{display:grid;grid-template-columns:140px 1fr auto;gap:24px;align-items:center;border-block:1px solid var(--line);padding:24px 0}.start-strip .eyebrow{margin:0;font-size:10px}.start-strip p{font-size:14px;color:#5a6973;max-width:68ch}.start-strip a{font-size:13px;font-weight:600}.section-heading{padding:64px 0 28px}.section-heading .eyebrow{margin-bottom:16px}.section-heading h2{font-size:clamp(34px,4vw,52px)}.section-heading>p:last-child{margin-top:16px;color:#62717a;font-size:17px}.journey{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.module{display:flex;flex-direction:column;gap:0;min-width:0;border:1px solid var(--line);border-top:4px solid var(--module-accent);border-radius:20px;background:#fff;padding:26px;transition:transform .2s,border-color .2s}.module:hover{color:var(--ink);transform:translateY(-5px);border-color:var(--module-accent)}.module-top{display:flex;align-items:center;gap:12px;margin-bottom:30px;width:100%}.module-number{font:20px var(--mono);color:var(--module-accent)}.module .meta{font:9px var(--mono);color:#62717a;line-height:1.5}.module svg{width:44px;height:44px;margin-left:auto;stroke:var(--module-accent);stroke-width:2.4;flex-shrink:0}.module h2{font-size:clamp(26px,2.65vw,38px);line-height:1.09}.module p{font-size:16px;color:#62717a;margin-top:18px;line-height:1.5}.module-outcome{margin-top:auto;padding-top:30px}.module-outcome span{display:block;font:9px var(--mono);color:var(--module-accent);letter-spacing:.07em;margin-bottom:9px}.module-outcome strong{font-size:15px}.module-cta{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);margin-top:23px;padding-top:19px;font-size:13px;font-weight:600}.module-cta b{color:var(--module-accent);font-size:22px}.materials-hub{margin:70px 0;display:grid;grid-template-columns:1fr 1.3fr;gap:70px;background:#14232d;color:white;padding:clamp(28px,4vw,52px);border-radius:24px}.materials-hub .eyebrow{color:#a4d4b9;font-size:10px;line-height:1.7}.materials-hub h2{font-size:clamp(34px,4vw,54px)}.materials-hub p{font-size:16px;color:#b8c6ce;margin-top:20px}.materials-hub .primary{margin-top:27px;color:#14232d;background:#a4d4b9}.material-links{display:grid}.material-links a{border-top:1px solid #ffffff2f;padding:24px 0}.material-links a:first-child{padding-top:0;border:0}.material-links a>span{font:10px var(--mono);color:#93b5ca}.material-links h3{font-size:25px;margin-top:10px}.material-links p{font-size:14px;margin-top:10px}.material-links a:hover h3{color:#a4d4b9}.footer{border-color:var(--line);font-size:10px}.page-head{max-width:950px}.page-head>p{color:#62717a}.page-head .eyebrow{color:var(--blue);font-size:12px}.filters{border-radius:14px;background:#f3f0ea;gap:12px}.filters select{max-width:40%}input,select{border-radius:10px;background:#fff}.prompt-entry{background:#fff;border:1px solid var(--line);border-radius:18px;padding:28px;margin:18px 0}.prompt-entry h2{font-size:clamp(26px,3vw,38px)}.copy{border-radius:40px}.prompt-entry pre{background:#14232d;color:#e0e8ec;border-radius:12px}.reference{border-color:var(--line);padding:28px 0}.reference h2{font-size:30px}.reference a:hover{color:var(--blue)}.guide-note h3{font-size:22px}.handbook{font-size:18px}.handbook h1{font-size:clamp(38px,4.8vw,65px)}
@media(max-width:900px){.journey{grid-template-columns:1fr}.module{display:grid;grid-template-columns:1fr 1fr;column-gap:30px}.module-top{grid-column:1/-1;margin-bottom:15px}.module h2{font-size:32px}.module p{margin:0}.module-cta{grid-column:1/-1}.module-outcome{grid-column:1/-1;padding-top:20px}.start-strip{grid-template-columns:1fr auto}.start-strip>.eyebrow{grid-column:1/-1}.materials-hub{gap:30px}.hero{grid-template-columns:1.2fr .8fr}.hero-aside{padding:20px}.method-step{font-size:16px;padding:13px}}
@media(max-width:650px){.hero{grid-template-columns:1fr;padding:40px 0;gap:35px}.hero-aside{display:block;transform:none;padding:24px}.hero-actions{gap:20px}.hero-actions .primary{font-size:13px;gap:20px}.site-nav{gap:14px}.site-nav div{gap:13px}.site-nav div a{font-size:10px}.start-strip{grid-template-columns:1fr;gap:12px}.section-heading{padding-top:42px}.module{display:flex;padding:24px}.module h2{font-size:32px}.module p{margin-top:16px}.module-top{margin-bottom:23px}.module-outcome{padding-top:24px}.module-cta{width:100%}.materials-hub{grid-template-columns:1fr;margin:40px 0;padding:28px}.materials-hub h2{font-size:40px}.materials-hub p{font-size:15px}.material-links{margin-top:15px}.filters select{max-width:100%;width:100%}.prompt-entry{padding:20px}.prompt-entry header{flex-direction:column;gap:16px}.footer{flex-wrap:wrap}.page-head p{font-size:18px}}
/* A quiet entry page: one promise, one start button, three module links. */
.course-entry{max-width:1100px;min-height:100dvh;display:flex;flex-direction:column}
.entry-intro{padding:clamp(38px,7vh,76px) 0 clamp(30px,5vh,52px);max-width:960px}
.entry-intro .eyebrow{font:clamp(11px,.9vw,13px) var(--mono);letter-spacing:.035em;margin-bottom:clamp(18px,3vh,28px);text-transform:none;color:var(--muted,#62717a)}
.entry-intro h1{font-size:clamp(38px,5.8vw,76px);line-height:1.06;letter-spacing:-.045em;text-wrap:balance}
.entry-intro h1 strong{color:var(--blue)}
.entry-intro>p:not(.eyebrow){font-size:clamp(18px,1.7vw,22px);line-height:1.5;max-width:60ch;margin-top:clamp(18px,3vh,28px);color:#4b5e69}
.entry-intro .primary{margin-top:clamp(22px,3vh,30px)}
.entry-modules{border-top:1px solid var(--line)}
.entry-module{display:grid;grid-template-columns:48px 1fr 30px;gap:clamp(12px,2vw,25px);align-items:center;padding:clamp(20px,2.7vh,28px) 0;border-bottom:1px solid var(--line);transition:color .18s ease}
.entry-module:hover{color:var(--blue)}
.entry-number{font:clamp(12px,1.1vw,15px) var(--mono);color:#62717a}
.entry-module h2{font-size:clamp(21px,2vw,29px);line-height:1.2;letter-spacing:-.025em}
.entry-arrow{font-size:clamp(22px,2vw,29px);text-align:right;color:var(--blue)}
.entry-footer{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:clamp(24px,4vh,38px) 0;margin-top:auto;color:#54636e;font-size:clamp(12px,1vw,14px)}
@media(max-width:650px){.course-entry .site-nav{flex-wrap:wrap}.entry-module{grid-template-columns:28px 1fr 24px}.entry-intro h1 br{display:none}.entry-footer{gap:16px}.entry-intro .primary{padding:15px 22px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}