/* Shared guide and course typography, navigation and small-screen layouts. */
.ev-resource-page { color: var(--ink); background: var(--page); }
.ev-resource-page *, .ev-resource-page *::before, .ev-resource-page *::after { box-sizing: border-box; }
.ev-resource-page button, .ev-resource-page input, .ev-resource-page select { font-family: inherit; }
/* Focus: the planner's one ring, 3 px in var(--focus) (navy on light surfaces, sky blue on the navy header). */
.ev-resource-page :focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.er-guide-layout { gap: 36px !important; padding-top: 36px !important; }
.er-guide-nav { top: 90px !important; }
.er-guide-nav button { min-height: 38px; }
.er-guide-nav > div:nth-child(n+4) { font-size: var(--text-xs) !important; line-height: 1.65 !important; }
.er-intro { padding: 4px 0 14px; order: -1; }
.er-intro h1 { margin: 0 0 12px; font-size: clamp(28px, 3vw, 38px); line-height: 1.1; letter-spacing: -.035em; }
.er-intro p { margin: 0; max-width: 56ch; color: #536879; font-size: var(--text-base); line-height: 1.65; }
.er-guide-intro { max-width: 1180px; margin: 0 auto; padding: 36px 18px 0; }
.er-guide-layout { padding-top: 24px !important; }
.er-guide-main article { padding: 26px !important; border-radius: 14px !important; }
.er-guide-main article > p, .er-guide-main article > ul { font-size: 15px !important; line-height: 1.7 !important; }
.er-guide-main article h3 { font-size: 22px !important; letter-spacing: -.02em !important; }
.er-guide-main article li + li { margin-top: 8px; }
.er-guide-main article > div:last-child { line-height: 1.65 !important; }
@media (max-width: 900px) {
  .er-guide-layout { flex-direction: column !important; gap: 24px !important; }
  .er-guide-nav { position: static !important; width: 100% !important; }
  .er-guide-nav > div:nth-child(3) { display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 4px !important; }
  .er-guide-main { width: 100%; max-width: none !important; }
  .er-guide-nav > div:nth-child(4) { display: none; }
}
@media (max-width: 600px) {
  .er-guide-layout { padding: 24px 16px 48px !important; }
  .er-guide-intro { padding: 28px 16px 0; }
  .er-guide-nav > div:nth-child(3) { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .er-guide-nav button { min-width: 0; }
  .er-guide-main article { padding: 20px !important; }
  .er-guide-links { grid-template-columns: minmax(0,1fr) !important; }
  .er-guide-main a { overflow-wrap: anywhere; }
}

/* ── Guide library layout: Learn strip, rail, level sections, cards, quiz, glossary and links ── */
.gl-page{font-family:'Hanken Grotesk',ui-sans-serif,system-ui,sans-serif;}
.gl-learn{display:flex;gap:6px;flex-wrap:wrap;max-width:1180px;margin:0 auto;padding:14px 18px 0;}
.gl-learn a{display:inline-flex;align-items:center;min-height:36px;padding:6px 14px;border-radius:999px;border:1px solid var(--line2);background:#fff;color:var(--ink);font-size:var(--text-ui);font-weight:650;text-decoration:none;}
.gl-learn a:hover{border-color:var(--accent);color:#1d4fb8;}
.gl-learn a.on{background:var(--ev-navy);border-color:var(--ev-navy);color:#fff;}
.gl-page .er-guide-intro{padding-top:24px;}
.gl-layout{display:flex;gap:30px;max-width:1180px;margin:0 auto;padding:22px 18px 80px;align-items:flex-start;}
.gl-rail{width:248px;flex:none;position:sticky;top:76px;display:flex;flex-direction:column;gap:12px;max-height:calc(100vh - 92px);overflow:auto;overscroll-behavior:contain;padding:4px;margin:-4px;scrollbar-width:thin;}
.gl-rail-top{display:flex;flex-direction:column;gap:12px;}
.gl-main{flex:1;min-width:0;}
.gl-search{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line2);border-radius:10px;padding:0 12px;min-height:44px;color:#586e80;}
.gl-search svg{width:16px;height:16px;flex:none;}
.gl-search input{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:var(--text-sm);color:var(--ink);outline:none;min-height:42px;}
.gl-search:focus-within{border-color:var(--ev-navy);outline:3px solid var(--focus);outline-offset:2px;}
.gl-search input:focus-visible{outline:none;}
.gl-levels,.gl-only{display:flex;flex-wrap:wrap;gap:6px;}
.gl-pill{font:inherit;font-size:var(--text-xs);font-weight:650;color:#586e80;background:#fff;border:1px solid var(--line2);border-radius:999px;padding:6px 11px;min-height:34px;cursor:pointer;}
.gl-pill.on{background:var(--ev-navy);border-color:var(--ev-navy);color:#fff;}
.gl-topics{display:flex;flex-direction:column;gap:2px;background:#fff;border:1px solid var(--line2);border-radius:12px;padding:6px;}
.gl-topic{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;font:inherit;font-size:var(--text-ui);font-weight:600;color:#586e80;background:transparent;border:1px solid transparent;border-radius:8px;padding:7px 10px;min-height:36px;cursor:pointer;text-align:left;}
.gl-topic em{font-style:normal;font-size:var(--text-2xs);color:#8aa0b2;}
.gl-topic.on{background:var(--panel);border-color:var(--line2);color:var(--ink);font-weight:700;}
.gl-progress{background:var(--ev-navy);color:#fff;border-radius:12px;padding:12px 14px;font-size:var(--text-xs);}
.gl-progress>b{display:block;margin-bottom:8px;font-size:var(--text-ui);}
.gl-progress-row{display:grid;grid-template-columns:72px 1fr 32px;gap:8px;align-items:center;margin-bottom:6px;}
.gl-progress-row em{font-style:normal;color:#b8c9d6;text-align:right;}
.gl-progress small{display:block;color:#8fa9bd;margin-top:6px;font-size:var(--text-2xs);}
.gl-progress-sub{display:block;margin:10px 0 6px;padding-top:9px;border-top:1px solid #ffffff1f;color:#fff;font-weight:700;font-size:var(--text-ui);text-decoration:none;}
.gl-progress-sub:hover{color:var(--ev-sky);}
.gl-progress-sub::after{content:" ›";color:var(--ev-sky);}
.gl-bar{display:block;height:6px;border-radius:3px;background:#ffffff22;overflow:hidden;}
.gl-level-progress .gl-bar{background:var(--line);}
.gl-bar i{display:block;height:100%;background:var(--ev-sky);border-radius:3px;}
.gl-note{background:#fff;border:1px solid var(--line);border-radius:12px;padding:11px 13px;font-size:var(--text-xs);line-height:1.6;color:#586e80;}
.gl-foot{max-width:1180px;margin:-48px auto 0;padding:0 18px 64px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.gl-note b{color:var(--ink);}
.gl-continue{display:flex;align-items:center;gap:14px;background:var(--ev-navy);color:#fff;border-radius:14px;padding:16px 20px;text-decoration:none;margin-bottom:16px;}
.gl-continue span{font-size:var(--text-2xs);letter-spacing:.08em;text-transform:uppercase;color:var(--ev-sky);font-weight:700;}
.gl-continue b{flex:1;font-size:var(--text-base);font-weight:700;}
.gl-continue svg{width:18px;height:18px;color:var(--ev-sky);flex:none;}
.gl-featured{background:var(--ev-navy);border-radius:14px;padding:14px 16px 16px;margin-bottom:26px;}
.gl-featured-title{font-size:var(--text-2xs);letter-spacing:.1em;text-transform:uppercase;color:var(--ev-sky);font-weight:700;margin-bottom:10px;}
.gl-featured-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;}
.gl-featured-grid a{display:flex;flex-direction:column;gap:4px;background:#ffffff12;border:1px solid #ffffff22;border-radius:10px;padding:12px 13px;color:#fff;text-decoration:none;min-height:96px;}
.gl-featured-grid a:hover{background:#ffffff1f;border-color:var(--ev-sky);}
.gl-featured-grid b{font-size:var(--text-sm);line-height:1.3;}
.gl-featured-grid span:last-child{font-size:var(--text-xs);color:#b8c9d6;}
.gl-featured-lvl{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:var(--text-2xs);font-weight:750;margin-bottom:2px;box-shadow:0 0 0 1.5px var(--lvl-edge,#fff);}
.gl-level{margin-bottom:34px;}
.gl-level-head{display:flex;gap:16px;align-items:flex-start;margin-bottom:14px;}
.gl-level-num{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-size:var(--text-xl);font-weight:800;flex:none;}
.gl-level-copy{flex:1;min-width:0;}
.gl-level-copy h2{margin:0 0 3px;font-size:22px;letter-spacing:-.02em;line-height:1.2;}
.gl-level-copy p{margin:0;font-size:var(--text-sm);color:#586e80;line-height:1.5;}
.gl-level-blurb{margin-top:4px!important;}
.gl-level-progress{width:150px;flex:none;font-size:var(--text-xs);color:#586e80;text-align:right;}
.gl-level-progress b{display:block;color:var(--ink);margin-bottom:5px;}
.gl-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.gl-card{display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 18px;color:var(--ink);text-decoration:none;box-shadow:0 1px 2px #17304408;transition:transform .12s,box-shadow .12s,border-color .12s;}
.gl-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px #12364e1a;border-color:var(--line2);}
.gl-card.read{border-color:var(--ev-sky);}
.gl-card-top{display:flex;align-items:center;gap:8px;font-size:var(--text-xs);color:#586e80;font-weight:650;}
.gl-card-flag{margin-left:auto;color:#b8860b;font-size:var(--text-ui);}
.gl-card-flag.done{color:var(--ev-sky-ink);background:var(--ev-sky);border-radius:50%;width:20px;height:20px;display:grid;place-items:center;}
.gl-card-flag.done svg{width:12px;height:12px;}
.gl-card-flag+.gl-card-flag{margin-left:0;}
.gl-card b{font-size:var(--text-base);line-height:1.3;letter-spacing:-.01em;}
.gl-card-sum{font-size:var(--text-ui);color:#586e80;line-height:1.5;}
.gl-card-foot{display:flex;align-items:center;gap:6px;font-size:var(--text-xs);color:#8aa0b2;margin-top:auto;padding-top:4px;}
.gl-card-foot svg{width:14px;height:14px;margin-left:auto;color:var(--accent);}
.gl-empty{background:#fff;border:1px dashed var(--line2);border-radius:14px;padding:28px;text-align:center;color:#586e80;}
.gl-empty b{display:block;color:var(--ink);font-size:var(--text-base);margin-bottom:6px;}
.gl-btn{font:inherit;font-size:var(--btn-fs);font-weight:650;color:var(--accentInk);background:var(--accent);border:1px solid var(--accent);border-radius:var(--btn-r);padding:9px 16px;min-height:var(--btn-h);cursor:pointer;}
.gl-btn:hover{background:var(--accent-hover);border-color:var(--accent-hover);}
.gl-quiz-cta{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 18px;margin-top:14px;}
.gl-quiz-cta b{display:block;font-size:14.5px;}
.gl-quiz-cta span{font-size:var(--text-ui);color:#586e80;}
.gl-quiz{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px 20px;margin-top:14px;}
.gl-quiz-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;font-size:15px;}
.gl-score{background:var(--ev-sky);color:var(--ev-sky-ink);border-radius:999px;padding:4px 12px;font-weight:750;}
.gl-q{border:0;padding:0;margin:0 0 16px;}
.gl-q legend{font-weight:700;font-size:var(--text-sm);margin-bottom:8px;padding:0;}
.gl-q-opt{display:flex;align-items:flex-start;gap:9px;padding:8px 10px;border:1px solid var(--line);border-radius:9px;margin-bottom:6px;font-size:var(--text-sm);cursor:pointer;}
.gl-q-opt input{margin:3px 0 0;accent-color:var(--ev-navy);}
.gl-q-opt.right{border-color:#4ba069;background:#eef8f0;}
.gl-q-opt.wrong{border-color:#d42626;background:#fdf1f1;}
.gl-q-why{font-size:var(--text-ui);line-height:1.55;color:#586e80;margin:6px 0 0;padding:9px 12px;border-radius:9px;}
.gl-q-why p{margin:0;}
.gl-q-why p+p{margin-top:5px;}
.gl-q-why.is-right{background:var(--ev-ok-bg);border:1px solid #cfe3a6;color:#2f5410;}
.gl-q-why.is-wrong{background:var(--ev-bad-bg);border:1px solid #f2c4c2;color:#7a241d;}
.gl-q-tag{margin-left:auto;align-self:center;flex:none;padding:2px 8px;border-radius:999px;font-style:normal;font-size:var(--text-2xs);font-weight:750;color:#fff;background:var(--ev-bad);}
.gl-q-opt.right .gl-q-tag{background:var(--ev-ok);}
.gl-q.missing legend{color:#8a5a00;}
.gl-q.missing .gl-q-opt{border-color:#e7b85a;}
.gl-quiz-msg{margin:10px 0 0;padding:9px 12px;border-radius:9px;background:#fff7e6;border:1px solid #ffcf73;color:#5c3d00;font-size:var(--text-ui);font-weight:600;}
.gl-clear-end{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:-10px 0 20px;padding:14px 18px;background:#fff;border:1px dashed var(--line2);border-radius:14px;font-size:var(--text-ui);color:#586e80;}
.gl-az{display:flex;flex-wrap:wrap;gap:4px;margin:0 0 14px;padding:8px;background:#fff;border:1px solid var(--line);border-radius:12px;position:sticky;top:var(--gl-top,0px);z-index:5;box-shadow:0 6px 14px #1230440d;}
.gl-az a,.gl-az span{display:grid;place-items:center;flex:1 1 0;min-width:0;height:32px;border-radius:7px;font-size:var(--text-ui);font-weight:700;text-decoration:none;}
.gl-az a{color:#1d4fb8;background:var(--panel);}
.gl-az a:hover{background:#e4ecf9;}
.gl-az span{color:#c3ced8;}
.gl-gloss>div.is-target{border-color:var(--accent);box-shadow:0 0 0 3px #d6e2fb;}
.gl-gloss>div:focus{outline:none;}
.gl-focus .gl-back{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:var(--text-ui);font-weight:650;color:#1d4fb8;background:transparent;border:0;padding:6px 0;margin-bottom:10px;cursor:pointer;}
.gl-focus .gl-back svg{width:16px;height:16px;}
.gl-focus .g-guide{background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px 30px;}
.gl-prevnext{display:flex;justify-content:space-between;gap:12px;margin-top:16px;}
.gl-prevnext a{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 16px;color:var(--ink);text-decoration:none;max-width:48%;font-size:var(--text-sm);font-weight:650;line-height:1.3;}
.gl-prevnext a.next{margin-left:auto;text-align:right;}
.gl-prevnext a small{display:block;font-size:var(--text-2xs);color:#586e80;font-weight:600;text-transform:uppercase;letter-spacing:.06em;margin-bottom:2px;}
.gl-prevnext a svg{width:16px;height:16px;color:var(--accent);flex:none;}
.gl-gloss{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0;}
.gl-gloss>div{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 15px;}
.gl-gloss dt{font-weight:700;font-size:var(--text-sm);margin-bottom:4px;color:#1d4fb8;}
.gl-gloss dd{margin:0;font-size:var(--text-sm);line-height:1.55;color:#3d4b57;}
.gl-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
.gl-links a{display:flex;flex-direction:column;gap:5px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px;text-decoration:none;color:var(--ink);}
.gl-links a:hover{border-color:var(--accent);}
.gl-links b{font-size:var(--text-sm);font-weight:700;}
.gl-links span{font-size:var(--text-xs);line-height:1.5;color:#586e80;}
.gl-links small{font-size:var(--text-2xs);color:#64798a;}
@media (max-width:900px){
  .gl-layout{flex-direction:column;align-items:stretch;gap:20px;}
  .gl-rail{position:static;width:100%;max-height:none;overflow:visible;padding:0;margin:0;}
  .gl-topics{flex-direction:row;flex-wrap:wrap;}
  .gl-topic{width:auto;min-height:34px;padding:6px 10px;}
  .gl-progress{display:none;}
  .gl-featured-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .gl-level-progress{display:none;}
  .gl-foot{margin-top:-28px;grid-template-columns:minmax(0,1fr);}
  /* An opened guide or the glossary shows only the search above it: the level, topic and saved filters belong to the guide list. */
  .is-focus .gl-levels,.is-focus .gl-topics,.is-focus .gl-only,
  .is-glossary .gl-levels,.is-glossary .gl-topics,.is-glossary .gl-only{display:none;}
  .is-focus,.is-glossary{gap:14px;}
  /* In the guide list, search and levels stay in a strip under the header so a reader deep in the list can switch level or search. */
  .is-guides{gap:14px;}
  .is-guides .gl-rail{display:contents;}
  .is-guides .gl-rail-top{position:sticky;top:var(--gl-top,0px);z-index:30;gap:8px;margin:-6px -18px 0;padding:10px 18px;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 6px 14px #1230440d;}
}
@media (max-width:600px){
  .gl-learn{padding:12px 16px 0;}
  .gl-layout{padding:18px 16px 48px;}
  .gl-foot{padding:0 16px 40px;}
  .is-guides .gl-rail-top{margin:-6px -16px 0;padding:8px 16px;}
  .gl-levels{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;}
  .gl-levels .gl-pill{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:44px;padding:4px 2px;border-radius:10px;font-size:var(--text-xs);line-height:1.15;text-align:center;}
  .gl-pill-sep{display:none;}
  .gl-pill-n{font-size:var(--text-ui);font-weight:800;}
  .gl-grid,.gl-gloss,.gl-links{grid-template-columns:minmax(0,1fr);}
  .gl-continue{flex-wrap:wrap;gap:6px 12px;padding:14px 16px;}
  .gl-continue span{flex:1 1 100%;}
  .gl-continue b{flex:1;min-width:0;font-size:15px;}
  .gl-featured-grid a{padding:10px 11px;min-height:0;}
  .gl-featured-grid b{font-size:var(--text-ui);}
  .gl-az{gap:3px;padding:6px;}
  .gl-az a,.gl-az span{min-width:0;flex:1 0 calc(100% / 9 - 3px);height:32px;}
  .gl-focus .g-guide{padding:20px 18px;}
  .gl-prevnext{flex-direction:column;}
  .gl-prevnext a,.gl-prevnext a.next{max-width:none;margin-left:0;text-align:left;}
  .gl-level-head{gap:12px;}
  .gl-level-num{width:36px;height:36px;font-size:17px;}
  .gl-level-copy h2{font-size:19px;}
}
@media print{
  .gl-learn,.gl-rail,.er-guide-intro,.gl-back,.gl-prevnext,.gl-featured,.gl-continue,.gl-quiz,.gl-quiz-cta,.gl-foot,.gl-clear-end,.gl-az{display:none!important;}
  .gl-layout{padding:0;display:block;}
  .gl-focus .g-guide{border:0;padding:0;}
  body{background:#fff;}
}

/* Guide library and Training courses, 19 October 2026: the planner's faint page grid behind both pages, so they match the home and project pages. */
.ev-resource-page { background-color: var(--page); background-image: linear-gradient(var(--page-grid) 1px, transparent 1px), linear-gradient(90deg, var(--page-grid) 1px, transparent 1px); background-size: 28px 28px; }

/* Interactive figures, 26 October 2026: every guide figure gathered on one view (#figures), grouped, with a still of each,
   and one figure at full width (#fig=name) with a link back to the guide it belongs to. The level and topic rail is hidden. */
.is-figures .gl-rail,.is-fig .gl-rail{display:none;}
.gl-fig-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;}
.gl-fig-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;color:var(--ink);text-decoration:none;box-shadow:0 1px 2px #17304408;transition:transform .12s,box-shadow .12s,border-color .12s;}
.gl-fig-card:hover{transform:translateY(-2px);box-shadow:0 10px 24px #12364e1a;border-color:var(--line2);}
.gl-fig-card:focus-visible{outline:3px solid var(--focus);outline-offset:2px;}
.gl-fig-pic{display:block;aspect-ratio:8/5;background:var(--panel);border-bottom:1px solid var(--line);}
.gl-fig-pic img{display:block;width:100%;height:100%;object-fit:cover;}
.gl-fig-copy{display:flex;flex-direction:column;gap:4px;padding:12px 14px 4px;}
.gl-fig-copy b{font-size:var(--text-base);line-height:1.3;letter-spacing:-.01em;}
.gl-fig-copy span{font-size:var(--text-ui);color:#586e80;line-height:1.5;}
.gl-fig-go{display:flex;align-items:center;gap:4px;margin-top:auto;padding:8px 14px 12px;font-size:var(--text-xs);font-weight:700;color:#1d4fb8;}
.gl-fig-go svg{width:14px;height:14px;}
.gl-fig-one{background:#fff;border:1px solid var(--line);border-radius:16px;padding:clamp(14px,3vw,24px);}
.gl-fig-kicker{font-size:var(--text-2xs);letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:#1d4fb8;margin-bottom:4px;}
.gl-fig-one .g-title{margin:0 0 6px;}
.gl-fig-lede{margin:0 0 12px;font-size:var(--text-sm);color:#586e80;line-height:1.55;max-width:70ch;}
.gl-fig-one .g-figure{margin:0 0 14px;}
.gl-fig-guide{display:flex;align-items:center;gap:10px;justify-content:space-between;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 16px;color:var(--ink);text-decoration:none;font-size:var(--text-sm);font-weight:650;}
.gl-fig-guide small{display:block;font-size:var(--text-2xs);color:#586e80;font-weight:600;text-transform:uppercase;letter-spacing:.06em;margin-bottom:2px;}
.gl-fig-guide svg{width:16px;height:16px;color:var(--accent);flex:none;}
.gl-fig-guide:hover{border-color:var(--accent);}

/* Page colour, 28 October 2026: the Guide library and Learning hub take the blue-grey --page; Terms keeps the lighter page. */
.gl-page, .lh-page { background-color: var(--page); background-image: linear-gradient(var(--page-grid) 1px, transparent 1px), linear-gradient(90deg, var(--page-grid) 1px, transparent 1px); }