/* ==========================================================================
   JPC Handbooks – reading layout. Loads after jpic-shared, jpc-domestic,
   onboarding and brand CSS. JPC palette only: burgundy #880D27, JPC Blue
   #4980C1 (thin accents), neutrals.
   ========================================================================== */

/* ---------- Shorter hero for reading pages ---------- */
.km-hero.hb-hero{min-height:0;height:auto;}
.hb-hero .km-hero-inner{padding:150px 32px 56px;}
.hb-hero .km-hero-title{font-size:clamp(32px,4.4vw,56px);}
@media (max-width:1023px){ .hb-hero .km-hero-inner{padding:90px 20px 40px;} }
.hb-crumbs ol{list-style:none;margin:0 0 14px;padding:0;display:flex;flex-wrap:wrap;gap:6px;font:600 .9rem/1.4 var(--km-body);color:rgba(255,255,255,.85);}
.hb-crumbs li{display:flex;align-items:center;gap:6px;}
.hb-crumbs li + li::before{content:'\203A';content:'\203A' / '';opacity:.7;}
.hb-crumbs a{color:#fff;text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,255,255,.5);}
.hb-crumbs a:hover{text-decoration-color:#fff;}

/* ---------- Two-column reading layout ---------- */
.hb-zone{padding-block:clamp(36px,5vw,64px);}
.hb-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:clamp(28px,4vw,56px);align-items:start;}
.hb-aside-sticky{position:sticky;top:84px;max-height:calc(100vh - 100px);overflow-y:auto;display:flex;flex-direction:column;gap:22px;padding-right:6px;}
.hb-mobile-toc{display:none;}
@media (max-width:1100px){
  .hb-layout{grid-template-columns:1fr;}
  .hb-aside-sticky{display:none;}
  .hb-mobile-toc{display:block;background:#fff;border:1px solid var(--grey-200);border-radius:14px;padding:4px 16px;}
  .hb-mobile-toc summary{cursor:pointer;padding:12px 0;font:700 1rem/1.3 var(--km-display);color:var(--jpic-burgundy);display:flex;align-items:center;gap:10px;}
  .hb-mobile-toc .hb-toc-block{padding-bottom:12px;}
}
/* Phones and tablets: the section bar under the header, the contents sheet it opens and "Back to contents" after each
   section (handbooks.js turns them on, and hides the "Contents" box above, which stays for browsers without scripts) */
.hb-secbar,.hb-backtoc{display:none;}
@media (max-width:1100px){
  body.hb-has-secbar .hb-aside{display:none;}   /* (only the "Contents" box shows in it at this width) */
  body.hb-has-secbar .hb-zone{padding-top:0;}
  .hb-secbar:not([hidden]){display:block;position:sticky;top:0;z-index:900;margin:0 0 20px;padding:8px 20px;
    background:rgba(255,255,255,.96);border-bottom:1px solid var(--grey-200);box-shadow:0 6px 14px rgba(26,34,48,.06);}
  .hb-backtoc{display:block;margin:1.4em 0 0;}
  body.hb-has-secbar .hb-article h2,body.hb-has-secbar .hb-article h3,body.hb-has-secbar .hb-article h4{scroll-margin-top:84px;}
}
@media (max-width:1023px){
  .hb-secbar:not([hidden]){top:60px;}   /* under the fixed phone header */
  body.hb-has-secbar .hb-article h2,body.hb-has-secbar .hb-article h3,body.hb-has-secbar .hb-article h4{scroll-margin-top:144px;}
}
.hb-secbar-btn{display:flex;align-items:center;gap:10px;width:100%;max-width:1160px;min-height:44px;margin:0 auto;padding:6px 14px;
  border:1px solid var(--grey-200);border-radius:12px;background:#fff;color:var(--grey-700);font:500 .95rem/1.3 var(--km-body);text-align:left;cursor:pointer;}
.hb-secbar-btn > i{flex:none;color:var(--jpic-burgundy);}
.hb-secbar-label{flex:none;font:700 1rem/1.2 var(--km-display);color:var(--jpic-burgundy);}
.hb-secbar-now{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.hb-secbar-now:not(:empty){padding-left:10px;border-left:1px solid var(--grey-200);}
.hb-secbar-cue{margin-left:auto;font-size:.8rem;}
.hb-secbar-btn:hover{border-color:var(--jpic-burgundy);}
.hb-secbar-btn:focus-visible,.hb-backtoc-btn:focus-visible{outline:3px solid var(--jpc-blue,#4980C1);outline-offset:2px;}
.hb-backtoc-btn{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 0;border:0;background:none;cursor:pointer;
  color:var(--jpic-burgundy);font:600 .95rem/1.3 var(--km-body);text-decoration:underline;text-decoration-color:rgba(136,13,39,.35);text-underline-offset:3px;}
.hb-backtoc-btn:hover{text-decoration-color:var(--jpic-burgundy);}
.hb-backtoc-btn i{font-size:.8rem;text-decoration:none;}
/* The sheet (a dialog, styled like the onboarding pages' "Need help?" sheet, .ob-help): the heading stays, the lists scroll */
.hb-sheet[open]{display:flex;flex-direction:column;overflow:hidden;}
.hb-sheet-body{overflow-y:auto;overscroll-behavior:contain;padding:6px 14px 18px;display:grid;gap:20px;}
.hb-sheet .hb-toc-block a{min-height:44px;align-items:center;}
.hb-article h2[tabindex="-1"]:focus{outline:none;}
.hb-article h2[tabindex="-1"]:focus-visible{outline:3px solid var(--jpc-blue,#4980C1);outline-offset:4px;border-radius:4px;}
/* While editing, the editor's strip sits above the header: the bar moves down with it (--jpe-top, set by editor.js) */
html.jpe-in-view .hb-secbar:not([hidden]){top:var(--jpe-top,0px);}
@media (max-width:1023px){
  html.jpe-in-view .hb-secbar:not([hidden]){top:calc(60px + var(--jpe-top,0px));}
  html.jpe-in-view body.hb-has-secbar .hb-article h2,html.jpe-in-view body.hb-has-secbar .hb-article h3,html.jpe-in-view body.hb-has-secbar .hb-article h4{scroll-margin-top:68px;}
}
.hb-toc-title{font:700 .78rem/1.2 var(--km-body);letter-spacing:.12em;text-transform:uppercase;color:var(--grey-600);margin:0 0 8px;display:flex;align-items:center;gap:8px;}
.hb-toc-title::before{content:'';width:14px;height:2px;background:var(--jpc-blue,#4980C1);border-radius:1px;}
.hb-toc-block ol{list-style:none;margin:0;padding:0;display:grid;gap:1px;}
.hb-toc-block a{display:flex;gap:10px;align-items:baseline;padding:7px 10px;border-radius:8px;color:var(--grey-700);text-decoration:none;font-size:.92rem;line-height:1.35;border-left:3px solid transparent;}
.hb-toc-block a span{font:700 .8rem/1 var(--km-display);color:var(--jpic-burgundy);min-width:2.2em;}
.hb-toc-block a:hover{background:var(--jpic-soft);color:var(--jpic-burgundy);}
.hb-toc-block a.is-active{background:var(--jpic-soft);color:var(--jpic-burgundy);border-left-color:var(--jpic-burgundy);font-weight:600;}
.hb-sections a{align-items:center;}
.hb-sections a i{color:var(--jpic-burgundy);width:18px;text-align:center;flex:none;}
.hb-sections a[aria-current="page"]{background:var(--jpic-burgundy);color:#fff;font-weight:600;}
.hb-sections a[aria-current="page"] i{color:#fff;}

/* ---------- Article typography ---------- */
.hb-article{min-width:0;max-width:820px;color:var(--grey-700);font-size:1.0625rem;line-height:1.75;}
.hb-article > :first-child{margin-top:0;}
.hb-article h2{font:800 clamp(1.45rem,2.4vw,1.85rem)/1.25 var(--km-display);color:var(--jpic-burgundy);margin:2.4em 0 .7em;padding-top:.9em;border-top:1px solid var(--grey-200);scroll-margin-top:90px;display:flex;gap:.55em;align-items:baseline;text-wrap:balance;}
.hb-article h2:first-child{border-top:0;padding-top:0;}
.hb-article h2 .hb-num{flex:none;font-weight:800;color:var(--jpc-blue,#4980C1);font-size:.8em;}
.hb-article h2.hb-plain{display:block;}
.hb-article h3{font:700 1.2rem/1.35 var(--km-display);color:var(--grey-900);margin:1.8em 0 .5em;scroll-margin-top:90px;}
/* h4: a heading under an h3 (Sport's sports under each group); bold, not underlined, so it doesn't read as a link */
.hb-article h4{font:700 1.0625rem/1.4 var(--km-display);color:var(--grey-900);margin:1.5em 0 .4em;scroll-margin-top:90px;}
.hb-article li.hb-li-bare{list-style:none;}
.hb-article p{margin:0 0 1em;}
.hb-article ul,.hb-article ol{margin:0 0 1.2em;padding-left:1.4em;}
.hb-article li{margin:.3em 0;}
.hb-article li::marker{color:var(--jpic-burgundy);}
.hb-article a{color:var(--jpic-burgundy);font-weight:600;text-decoration:underline;text-decoration-color:rgba(136,13,39,.35);text-underline-offset:3px;}
.hb-article a:hover{text-decoration-color:var(--jpic-burgundy);}
.hb-article a.hb-doc::after{content:' (PDF)';font-weight:400;font-size:.85em;color:var(--grey-600);}
.hb-article a[target="_blank"]:not(.hb-doc)::after{content:'\2197';content:'\2197' / '';font-size:.8em;margin-left:2px;text-decoration:none;display:inline-block;}
.hb-article strong{color:var(--grey-900);}
.hb-article img{max-width:100%;height:auto;border-radius:12px;display:block;margin:1.2em 0;}
.hb-article td img{margin:0 auto;}
/* Pictures in tables keep their set size (a table cell would otherwise squash them to icon size); on phones they fit the width */
.hb-table td img,.hb-table th img{max-width:none;}
@media (max-width:700px){.hb-table td img,.hb-table th img{max-width:100%;}}
.hb-figure{margin:1.4em 0;}
.hb-figure img{margin:0;}
.hb-figure figcaption{font-size:.9rem;color:var(--grey-600);margin-top:8px;}

/* Tables */
.hb-table{overflow-x:auto;margin:1.2em 0 1.6em;border:1px solid var(--grey-200);border-radius:14px;background:#fff;box-shadow:0 6px 18px rgba(26,34,48,.04);}
.hb-table table{width:100%;border-collapse:collapse;font-size:.97rem;}
.hb-table td,.hb-table th{padding:12px 16px;border-bottom:1px solid var(--grey-200);vertical-align:top;text-align:left;}
.hb-table tr:last-child td,.hb-table tr:last-child th{border-bottom:0;}
.hb-table tr:first-child td,.hb-table tr:first-child th{background:var(--off-white,#f5f7fa);}
.hb-table th{font-weight:400;}
.hb-table th[scope="col"]{font-weight:700;}
.hb-table tr:first-child td strong,.hb-table th{font-family:var(--km-display);color:var(--grey-900);}
.hb-table p{margin:0 0 .5em;}
.hb-table p:last-child{margin:0;}

/* Previous / next */
.hb-pager{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:3.5em;padding-top:2em;border-top:1px solid var(--grey-200);}
.hb-pager a{display:flex;flex-direction:column;gap:4px;padding:18px 20px;border:1px solid var(--grey-200);border-radius:14px;text-decoration:none;color:var(--jpic-burgundy);font:700 1.05rem/1.3 var(--km-display);transition:border-color .2s,background .2s;}
.hb-pager a span{font:600 .78rem/1 var(--km-body);letter-spacing:.1em;text-transform:uppercase;color:var(--grey-600);}
.hb-pager a:hover{border-color:var(--jpic-burgundy);background:var(--jpic-soft);}
.hb-pager-next{text-align:right;align-items:flex-end;}
.hb-pager-prev span::before{content:'\2190  ';content:'\2190  ' / '';}
.hb-pager-next span::after{content:'  \2192';content:'  \2192' / '';}
@media (max-width:600px){ .hb-pager{grid-template-columns:1fr;} .hb-pager-next{text-align:left;align-items:flex-start;} }

/* ---------- Section cards (handbook landing) ---------- */
.hb-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px;margin-top:36px;}
.hb-card{position:relative;display:flex;flex-direction:column;gap:10px;padding:26px 24px 22px;background:#fff;border:1px solid var(--grey-200);border-radius:18px;text-decoration:none;color:var(--grey-900);
  box-shadow:0 8px 22px rgba(26,34,48,.05);transition:transform .25s,box-shadow .25s,border-color .25s;}
.hb-card:hover,.hb-card:focus-visible{transform:translateY(-4px);box-shadow:0 16px 34px rgba(26,34,48,.1);border-color:var(--jpic-burgundy);}
.hb-card-icon{width:56px;height:56px;border-radius:14px;background:var(--jpic-burgundy);color:#fff;display:grid;place-items:center;font-size:26px;}
.hb-card-num{position:absolute;top:22px;right:22px;font:800 1.4rem/1 var(--km-display);color:var(--grey-200);}
.hb-card h3{margin:6px 0 0;font:800 1.2rem/1.3 var(--km-display);color:var(--jpic-burgundy);}
.hb-card p{margin:0;color:var(--grey-600);font-size:.95rem;}
.hb-card-cue{margin-top:auto;padding-top:8px;font:700 .9rem/1 var(--km-body);color:var(--grey-700);}
.hb-card--ext .hb-card-icon{background:#fff;color:var(--jpic-burgundy);border:2px solid var(--jpic-burgundy);}
/* A handbook card with no picture at all (R3.24: its list entry and its front page's banner both have none, or both were
   withdrawn): white words on burgundy instead of on the page's own pale band */
.hx-doors[data-hb-cards] .hx-door:not(:has(> .hx-door-img)){background:var(--jpic-burgundy);}
.hb-search-wrap{margin-top:40px;}

/* ---------- Search ---------- */
.hb-search{display:flex;align-items:center;gap:10px;background:#fff;border:2px solid var(--grey-200);border-radius:14px;padding:6px 6px 6px 16px;max-width:760px;margin:24px auto 0;transition:border-color .2s;}
.hb-search:focus-within{border-color:var(--jpic-burgundy);}
.hb-search > i{color:var(--jpic-burgundy);font-size:1.1rem;}
.hb-search input{flex:1;min-width:0;border:0;outline:0;font:400 1rem/1.4 var(--km-body);padding:10px 4px;background:transparent;color:var(--grey-900);}
.hb-search .km-btn{padding:10px 20px;font-size:1rem;background:var(--jpic-burgundy);color:#fff;box-shadow:none;}
body.jpc-domestic .hb-search .km-btn-gold{background:var(--jpic-burgundy);color:#fff;}
.hb-search--big{padding:8px 8px 8px 20px;}
.hb-search--big input{font-size:1.1rem;padding:12px 4px;}
.hb-aside .hb-search{margin:0;padding:4px 4px 4px 12px;}
.hb-aside .hb-search .km-btn{padding:8px 12px;font-size:.9rem;}
.hb-search-page{max-width:880px;}
.hb-search-status{text-align:center;color:var(--grey-600);margin:18px 0 8px;}
.hb-results{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:12px;}
/* Each result is a card; only its title is the link (handbooks.js), and the link's ::after covers the card, so the
   card can still be clicked anywhere (the "stretched link") */
.hb-results li{position:relative;padding:18px 22px;background:#fff;border:1px solid var(--grey-200);border-radius:14px;color:var(--grey-700);transition:border-color .2s,background .2s;}
.hb-results li:hover,.hb-results li:focus-within{border-color:var(--jpic-burgundy);background:var(--jpic-soft);}
.hb-results a.hb-r-title{text-decoration:none;}
.hb-results a.hb-r-title::after{content:'';position:absolute;inset:0;border-radius:inherit;}
.hb-results a.hb-r-title:hover{text-decoration:underline;text-underline-offset:3px;}
.hb-results a.hb-r-title:focus-visible{outline:none;}
.hb-results a.hb-r-title:focus-visible::after{outline:3px solid var(--jpc-blue,#4980C1);outline-offset:2px;}
.hb-results .hb-r-where{display:block;font:600 .8rem/1.3 var(--km-body);letter-spacing:.06em;text-transform:uppercase;color:var(--grey-600);margin-bottom:4px;}
.hb-results .hb-r-title{display:block;font:800 1.15rem/1.3 var(--km-display);color:var(--jpic-burgundy);margin-bottom:6px;}
@media (forced-colors:active){ .hb-results li{border-color:CanvasText;} .hb-results a.hb-r-title:focus-visible::after{outline-color:Highlight;} }
.hb-results .hb-r-snip{display:block;font-size:.95rem;line-height:1.6;}
.hb-results mark{background:rgba(73,128,193,.18);color:inherit;padding:0 2px;border-radius:3px;}

/* ---------- Principal's welcome ---------- */
.hb-welcome{display:grid;grid-template-columns:minmax(220px,340px) minmax(0,1fr);gap:clamp(28px,5vw,64px);align-items:start;}
.hb-portrait{margin:0;position:sticky;top:90px;}
.hb-portrait img{width:100%;height:auto;border-radius:18px;box-shadow:0 18px 40px rgba(26,34,48,.18);}
.hb-portrait figcaption{margin-top:14px;display:flex;flex-direction:column;}
.hb-portrait figcaption strong{font:800 1.1rem/1.3 var(--km-display);color:var(--jpic-burgundy);}
.hb-portrait figcaption span{color:var(--grey-600);}
.hb-letter{max-width:720px;color:var(--grey-700);font-size:1.0625rem;line-height:1.8;}
.hb-letter p{margin:0 0 1.1em;}
.hb-sign{margin-top:1.6em;}
@media (max-width:800px){ .hb-welcome{grid-template-columns:1fr;} .hb-portrait{position:static;max-width:280px;} }

@media print{
  .hb-aside,.hb-pager,.hb-search,.hb-crumbs,.hb-secbar,.hb-backtoc,.hb-sheet,.hb-printsec{display:none !important;}
  /* "Print this section": the section's heading starts the page */
  html.ob-print-one .hb-article h2.ob-print-target{margin-top:0;padding-top:0;border-top:0;}
  html.ob-print-one .hb-zone{padding-block:0 !important;}
  .hb-layout{grid-template-columns:1fr;}
  .hb-hero{min-height:0;}
}
.hb-article h3 .hb-num{color:var(--jpc-blue,#4980C1);font-weight:800;margin-right:.35em;}
.hb-aside{align-self:stretch;}
.hb-extra{margin-top:24px;max-width:760px;}
.jpicnav-rail-section{display:block;}
/* Long web addresses used as link text must wrap */
/* Long words wrap only when they must; long addresses (emails, URLs) may break anywhere.
   (anywhere on whole cells squeezed table labels to "CON TAC T") */
.hb-article{overflow-wrap:break-word;}
.hb-article a.hb-addr{overflow-wrap:anywhere;}
/* Table labels ("CONTACT NAME:") stay on one line */
.hb-table td.hb-label,.hb-table th.hb-label{white-space:nowrap;width:1%;font-weight:600;color:var(--grey-700);font-size:.85rem;letter-spacing:.03em;}
/* Contrast: blue section numbers stay at large-text size; card numbers readable */
.hb-article h2 .hb-num{font-size:max(.85em,1.2rem);}
.hb-card-num{color:var(--grey-500);font-size:1.25rem;}

/* ---------- Section cards with the original handbook illustrations ---------- */
.hb-card--art{padding:0;overflow:hidden;gap:0;}
.hb-card-art{display:block;line-height:0;}
.hb-card-art img{width:100%;height:auto;aspect-ratio:300/246;object-fit:cover;transition:transform .5s ease;}
.hb-card--art:hover .hb-card-art img{transform:scale(1.04);}
.hb-card-body{position:relative;display:flex;flex-direction:column;gap:8px;padding:18px 22px 20px;flex:1;}
.hb-card--art .hb-card-num{top:18px;right:20px;}
.hb-card--art h3{margin:0;padding-right:28px;}
.hb-card--art .hb-card-cue{padding-top:6px;}
/* Sidebar thumbnails */
.hb-sections .hb-thumb{width:34px;height:28px;object-fit:cover;border-radius:6px;flex:none;}
.hb-sections a[aria-current="page"] .hb-thumb{outline:2px solid #fff;}

/* Documents are links like any other: no "opens a new window" arrow, just a PDF label */
.hb-article a.hb-doc::after{content:' (PDF)';}

/* ---------- Tables on phones ---------- */
@media (max-width:700px){
  /* Label/value tables ("TERM:", "CONTACT NAME:") stack: label above its value, nothing squeezed */
  .hb-table--kv table,.hb-table--kv tbody,.hb-table--kv tr,.hb-table--kv td,.hb-table--kv th{display:block;width:auto;}
  .hb-table--kv tr{padding:12px 16px;border-bottom:1px solid var(--grey-200);}
  .hb-table--kv tr:last-child{border-bottom:0;}
  .hb-table--kv td,.hb-table--kv th{padding:2px 0;border:0;}
  .hb-table--kv td:empty,.hb-table--kv th:empty{display:none;}
  .hb-table--kv td.hb-label,.hb-table--kv th.hb-label{width:auto;white-space:normal;margin-top:4px;}
  .hb-table--kv tr:first-child td,.hb-table--kv tr:first-child th{background:none;}
  /* Grids (term timetables) keep their columns and scroll sideways */
  .hb-table:not(.hb-table--kv) td,.hb-table:not(.hb-table--kv) th{min-width:9em;}
}
/* "Text version of this image" boxes under the values poster and diagrams */
.hb-textalt{margin:.6em 0 1.4em;border:1px solid var(--grey-200);border-radius:10px;background:#fff;}
.hb-textalt > summary{cursor:pointer;padding:10px 14px;font-weight:600;color:var(--jpic-burgundy);}
.hb-textalt > summary:focus-visible{outline:2px solid var(--jpc-blue,#4980C1);outline-offset:2px;}
.hb-textalt[open] > summary{border-bottom:1px solid var(--grey-200);}
.hb-textalt > :not(summary){margin-left:14px;margin-right:14px;}
.hb-textalt > :last-child{margin-bottom:12px;}
.hb-textalt ul ul{margin-top:4px;}
@media print{.hb-textalt{display:none;}}
/* Formatting carried over from SharePoint's inline styles */
.hb-article .hb-u{text-decoration:underline;text-underline-offset:2px;}
.hb-article .hb-center{text-align:center;}
.hb-article ul.hb-list-none{list-style:none;padding-left:0;}
.hb-article ul.hb-list-circle{list-style-type:circle;}
.hb-article ul.hb-list-square{list-style-type:square;}
/* Label | value columns as on SharePoint (.spaced-list / .spaced-row, 200px label column) */
.hb-article .hb-col{display:inline-block;min-width:200px;}
.hb-article ul.hb-spaced.hb-list-none{padding-left:1.5em;}
.hb-article .hb-row{margin:0 0 10px;}
.hb-article .hb-row > .hb-col{display:inline-block;width:200px;}
@media (max-width:520px){.hb-article .hb-col{min-width:9.5em;}.hb-article .hb-row > .hb-col{width:9.5em;}}
/* "Image beside text" layout tables (one row, role=presentation): when the text column is too narrow for both,
   put the image above its text at its own width instead of squeezing it (Behaviour Plan, SOARING tree) */
.hb-article{container-type:inline-size;}
@container (max-width:780px){
  .hb-table table[role="presentation"],.hb-table table[role="presentation"] > tbody,
  .hb-table table[role="presentation"] > tbody > tr,.hb-table table[role="presentation"] > tbody > tr > td{display:block;width:auto;}
  .hb-table table[role="presentation"] td img{max-width:100%;height:auto;}
  .hb-table table[role="presentation"] > tbody > tr > td + td{border-top:0;}
}

/* ---------- Sub-headings in the contents (ul.hb-toc-sub under a section's entry, written by the build) ---------- */
/* With handbooks.js (.hb-toc-live) a section's sub-headings show only while it is the section being read
   (li.is-current), for a long section (data-long), and while the keyboard is on that section's entry, so Tab reaches
   them. Without the script they all show. */
.hb-toc-sub{list-style:none;margin:1px 0 4px;padding:0 0 0 2.2em;display:grid;gap:1px;}
.hb-toc-block .hb-toc-sub a{padding:5px 10px;font-size:.86rem;}
.hb-toc-block .hb-toc-sub a.is-active{background:none;border-left-color:var(--jpc-blue,#4980C1);}
.hb-toc-live li:not(.is-current):not([data-long]):not(:focus-within) > .hb-toc-sub{display:none;}
.hb-toc-block a:focus-visible{outline:3px solid var(--jpc-blue,#4980C1);outline-offset:-3px;}

/* ---------- "Print this section", under each section heading (handbooks.js) ---------- */
.hb-printsec{margin:-.4em 0 .9em;text-align:right;line-height:1;}
.hb-printsec-btn{display:inline-flex;align-items:center;gap:6px;font-size:.85rem;font-weight:600;padding:4px 2px;}
.hb-printsec-btn i{font-size:.95rem;text-decoration:none;}

/* ---------- Classes the handbook build writes (tools/build-handbooks.js) ---------- */
/* Bold one-line paragraphs the build turned into h3/h4 (R3.7): they look as they did (bold body text), and keep the
   headings' scroll-margin so a link to one doesn't land under the header */
.hb-article .hb-boldhead{font:inherit;font-weight:700;color:var(--grey-900);margin:0 0 1em;}
/* Links to the College's internal site (infohub): they only open on the staff network, so they say so. The label is
   read out with the link, like " (PDF)", so it has no empty alt text (unlike the arrows, R3.16). */
.hb-article a.hb-staffnet::after,
.hb-article a.hb-staffnet[target="_blank"]:not(.hb-doc)::after{content:' (staff network only)';font-weight:400;font-size:.85em;color:var(--grey-600);margin:0;display:inline;}
.hb-article a.hb-doc.hb-staffnet::after{content:' (PDF, staff network only)';}
/* "This text is from the … Handbook in SharePoint. It was last copied on …" at the foot of each section page.
   Printing gives the same date in its own source line at the top (js/onboarding.js), so it isn't printed twice. */
.hb-article .hb-source{margin:2.4em 0 0;padding-top:1em;border-top:1px solid var(--grey-200);font-size:.88rem;line-height:1.55;color:var(--grey-600);}
@media print{ .hb-article .hb-source{display:none;} }