/* Education, Strategy Library and FAQ article reader only. */
body.content-reader-open{overflow:hidden}
.content-backdrop{z-index:150;min-width:0;padding:clamp(12px,3vh,30px) clamp(12px,3vw,42px)}
.content-backdrop.content-backdrop-expanded{padding:0}
.content-modal{width:min(100%,980px);height:min(90dvh,920px);min-width:0;max-width:100%;max-height:100dvh;grid-template-rows:auto minmax(0,1fr) auto}
.content-modal.content-modal-expanded,.content-modal:fullscreen{width:100vw;height:100dvh;max-width:none;max-height:none;border-radius:0}
.content-modal>header{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:20px;max-height:36dvh;overflow-y:auto;padding:clamp(16px,2vw,26px) clamp(18px,3vw,38px)}
.content-modal-heading{min-width:0;max-width:76ch}
.content-modal>header .content-kicker{display:block;color:#68dcf9;font-size:10px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.content-modal h2{max-width:none;margin:7px 0 12px;color:#fff;font-size:clamp(22px,2.3vw,32px);line-height:1.2;overflow-wrap:anywhere}
.content-modal .content-byline{display:flex;flex-wrap:wrap;align-items:center;gap:7px 14px;margin:0;color:#adc3d0;font-size:11px;line-height:1.5}
.content-modal .content-byline span{color:#d5e7ef;font-size:11px;letter-spacing:0}
.content-modal .content-byline a{color:#68dcf9;overflow-wrap:anywhere}
.content-modal .content-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:13px}
.content-modal .content-tags span{color:#a4dceb;font-size:10px;letter-spacing:0}
.content-modal-controls{position:sticky;top:0;display:flex;align-items:center;justify-content:flex-end;gap:8px;flex:none;background:#07111af2}
.content-modal-controls .btn,.content-modal-controls .modal-close{min-height:40px;white-space:nowrap}
.content-modal-controls .btn{border-color:#38bdf8;color:#001016;background:#38bdf8}
.content-modal-controls .btn span{color:#001016;font-size:10px;letter-spacing:.04em}
.content-modal-controls .btn:hover{background:#71d5ff}
.content-modal .modal-close{height:40px}
.content-modal :is(button,a):focus-visible{outline:2px solid #8be4ff;outline-offset:3px}
.content-modal-body{min-width:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;overflow-anchor:none;padding:clamp(20px,3vw,38px)}
.content-reading{width:min(100%,76ch);min-width:0;margin-inline:auto}
.content-reading .rich-text{max-width:none;min-width:0;overflow-wrap:anywhere}
.content-reading .rich-text h3{margin:1.7em 0 .5em;color:#80e2fb;font-size:clamp(17px,1.3vw,19px);line-height:1.35;letter-spacing:0;text-transform:none}
.content-reading .rich-text h3:first-child{margin-top:0}
.content-reading .rich-text p,.content-reading .rich-text li{color:#dceaf0;font-size:clamp(15px,1.15vw,17px);line-height:1.72;overflow-wrap:anywhere}
.content-reading .rich-text p{margin:0 0 1.1em}
.content-reading .rich-text ul,.content-reading .rich-text ol{gap:.45em;margin:.35em 0 1.25em;padding-left:1.5em}
.content-reading .rich-text :is(pre,code,table){max-width:100%;overflow-x:auto}
.content-reading .content-media{width:100%;max-width:100%;margin:0 0 24px}
.content-reading .content-media img,.content-reading .content-media video{display:block;width:auto;height:auto;max-width:100%;max-height:min(70dvh,720px);object-fit:contain;margin-inline:auto}
.content-reading .content-attachment{max-width:100%;min-height:42px;align-items:center;overflow-wrap:anywhere}
.content-modal>footer{min-width:0;min-height:58px;gap:clamp(8px,2vw,18px);padding:9px 14px}
.content-modal>footer .btn{min-height:40px}
.content-modal>footer span{min-width:45px;text-align:center;font-size:11px}
@media(max-width:768px){
  .content-backdrop{padding:0}
  .content-modal{width:100vw;height:100dvh;max-width:none;max-height:none;border-radius:0;border-left:0;border-right:0}
  .content-modal>header{grid-template-columns:minmax(0,1fr);gap:10px;max-height:40dvh;padding:12px 16px 16px}
  .content-modal-controls{grid-row:1;justify-content:flex-end;margin:-12px -16px 0;padding:10px 16px 6px}
  .content-modal-heading{grid-row:2}
  .content-modal h2{font-size:clamp(20px,5.5vw,27px)}
  .content-modal-body{padding:20px 16px calc(28px + env(safe-area-inset-bottom))}
  .content-modal>footer{padding-bottom:calc(9px + env(safe-area-inset-bottom))}
}
@media(max-width:390px){
  .content-modal-controls .btn,.content-modal-controls .modal-close{padding:0 9px}
  .content-modal>footer .btn{padding:0 9px}
}
