/* The Knowledge Centre (#125, blocks #130): the library app and its page, from
   design-source/resources.html, scoped to the page. Loaded by the Library blocks (inc/blocks.php). */
.ceec-page-resources .rc-hero { position:relative; overflow:hidden; background:var(--gradient-teal); color:#fff; padding:clamp(48px,7vw,84px) 0; }
.ceec-page-resources .rc-hero::before { content:""; position:absolute; inset:0; background:radial-gradient(50% 120% at 90% 0%, rgba(233,97,21,.22), transparent 55%); }
.ceec-page-resources .rc-hero .wrap { position:relative; z-index:1; }
.ceec-page-resources .rc-hero h1 { margin-top:12px; font-size:clamp(32px,5vw,52px); font-weight:800; color:#fff; letter-spacing:-.02em; }
.ceec-page-resources .rc-hero p { margin-top:16px; max-width:56ch; font-size:17px; line-height:1.7; color:rgba(255,255,255,.85); }
.ceec-page-resources .rc-hero__in { display:grid; grid-template-columns:1.45fr 1fr; gap:44px; align-items:center; margin-top:16px; }
@media (max-width:860px){ .ceec-page-resources .rc-hero__in { grid-template-columns:1fr; } .ceec-page-resources .rc-hero__media { display:none; } }
.ceec-page-resources .rc-hero__media .ph-img { aspect-ratio:4/3.1; }
/* the newest covers, fanned out on the dotted panel (built by heroCovers()) */
.ceec-page-resources .rc-covers.has-covers { display:block; }
.ceec-page-resources .rc-cover { position:absolute; top:50%; left:50%; width:36%; aspect-ratio:3/4.2; border-radius:10px; overflow:hidden; background:#fff; box-shadow:0 24px 48px -18px rgba(0,0,0,.65), 0 0 0 1px rgba(255,255,255,.08); transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s; }
.ceec-page-resources .rc-cover img { display:block; width:100%; height:100%; object-fit:cover; object-position:top; }
.ceec-page-resources .rc-cover--l { transform:translate(-112%,-47%) rotate(-7deg); z-index:1; }
.ceec-page-resources .rc-cover--r { transform:translate(12%,-47%) rotate(7deg); z-index:1; }
.ceec-page-resources .rc-cover--c { transform:translate(-50%,-53%); z-index:2; width:40%; }
.ceec-page-resources .rc-cover--l:hover { transform:translate(-114%,-52%) rotate(-8deg); z-index:3; }
.ceec-page-resources .rc-cover--r:hover { transform:translate(14%,-52%) rotate(8deg); z-index:3; }
.ceec-page-resources .rc-cover--c:hover { transform:translate(-50%,-57%); }
.ceec-page-resources .rc-cover:hover { box-shadow:0 32px 60px -18px rgba(0,0,0,.75), 0 0 0 2px var(--orange-soft); }
.ceec-page-resources .rc-hero__photo { aspect-ratio:4/3.1; border-radius:var(--radius-2xl); overflow:hidden; border:1px solid rgba(255,255,255,.14); }
.ceec-page-resources .rc-hero__photo img { width:100%; height:100%; object-fit:cover; display:block; }
.ceec-page-resources .rc-search { margin-top:24px; display:flex; flex-wrap:wrap; gap:10px; max-width:680px; }
.ceec-page-resources .rc-search input { flex:1; border:none; border-radius:var(--radius-md); padding:14px 18px; font-size:15px; font-family:var(--font-sans); outline:none; min-width:0; }
.ceec-page-resources .rc-search select { border:none; border-radius:var(--radius-md); padding:0 12px; font-size:13.5px; font-family:var(--font-sans); color:var(--ink); background:#fff; outline:none; cursor:pointer; flex-shrink:0; }
.ceec-page-resources .rc-chips { margin-top:18px; display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.ceec-page-resources .rc-chips__lbl { width:100%; font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.6); margin-bottom:2px; }
.ceec-page-resources .rc-chips a { border:1px solid rgba(255,255,255,.28); color:#fff; border-radius:999px; padding:7px 15px; font-size:13.5px; font-weight:500; transition:all .2s; cursor:pointer; }
.ceec-page-resources .rc-chips a:hover, .ceec-page-resources .rc-chips a.on { background:rgba(255,255,255,.16); border-color:#fff; }

.ceec-page-resources .lib-layout { display:grid; grid-template-columns:2fr 1fr; gap:36px; align-items:start; margin-top:8px; }
@media (max-width:900px){ .ceec-page-resources .lib-layout { grid-template-columns:1fr; } }
.ceec-page-resources .feat-col { border:1px solid var(--panel-border); border-radius:var(--radius-2xl); background:#fff; padding:22px;
position:sticky; top:88px; max-height:calc(100vh - 108px); overflow:auto; }
@media (max-width:900px){ .ceec-page-resources .feat-col { position:static; max-height:none; } }
/* the toolbar is a 3-track grid, so every control fills its track and the
gaps read as one rhythm instead of three different ones */
.ceec-page-resources .toolbar .msel { width:100%; }
/* single-choice variant (sort): same button and panel, options are buttons with a check */
.ceec-page-resources .msel--single .msel__panel { min-width:100%; }
.ceec-page-resources .msel__find { position:sticky; top:-8px; z-index:1; margin:-8px -8px 6px; width:calc(100% + 16px); border:0; border-bottom:1px solid var(--panel-border); padding:11px 14px; font-family:var(--font-sans); font-size:13.5px; background:#fff; outline:none; }
.ceec-page-resources .msel__opt[hidden] { display:none; }
.ceec-page-resources button.msel__opt { width:100%; border:none; background:none; font-family:var(--font-sans); text-align:left; }
.ceec-page-resources button.msel__opt i { margin-left:auto; font-size:15px; color:var(--primary); visibility:hidden; }
.ceec-page-resources button.msel__opt.on { color:var(--primary); font-weight:600; }
.ceec-page-resources button.msel__opt.on i { visibility:visible; }
.ceec-page-resources .feat-col .fnote { margin-top:14px; font-size:12px; color:var(--text-soft); }
.ceec-page-resources #rc-featured { display:flex; flex-direction:column; gap:14px; margin-top:14px; }
.ceec-page-resources .tabs { display:flex; gap:8px; flex-wrap:wrap; margin-top:14px; }
.ceec-page-resources .rtab { font-family:var(--font-sans); border:1.5px solid var(--panel-border); background:#fff; border-radius:999px; padding:9px 18px; font-size:14px; font-weight:600; color:var(--text-soft); cursor:pointer; transition:all .2s; }
.ceec-page-resources .rtab:hover { border-color:var(--teal-soft); color:var(--ink); }
.ceec-page-resources .rtab.on { background:var(--primary); border-color:var(--primary); color:#fff; }
/* card covers: the PDF's first page as a sheet rising from the tile; video thumbnails full-bleed */
.ceec-page-resources .rcard .thumb.is-doc { height:150px; align-items:end; padding-top:18px; overflow:hidden; }
.ceec-page-resources .rcard .thumb.is-doc img { height:100%; width:auto; max-width:78%; object-fit:cover; object-position:top; border-radius:5px 5px 0 0; box-shadow:0 10px 28px -10px rgba(0,42,53,.4); background:#fff; transition:transform .25s ease; }
.ceec-page-resources .rcard:hover .thumb.is-doc img { transform:translateY(-4px); }
/* generated sheet for records without a cover image (mirrors the publication page's) */
.ceec-page-resources .rcard .gencover { height:100%; width:62%; display:flex; flex-direction:column; border-radius:5px 5px 0 0; overflow:hidden; background:#fff; box-shadow:0 10px 28px -10px rgba(0,42,53,.4); transition:transform .25s ease; }
.ceec-page-resources .rcard:hover .gencover { transform:translateY(-4px); }
.ceec-page-resources .gencover__band { position:relative; flex:none; height:42px; display:flex; align-items:flex-start; justify-content:space-between; padding:9px 11px; overflow:hidden; background:linear-gradient(135deg,#0a5063,var(--teal-deeper)); border-bottom:3px solid var(--orange); }
.ceec-page-resources .gencover__band::after { content:""; position:absolute; right:-18px; top:-26px; width:80px; height:80px; border-radius:50%; background:rgba(233,97,21,.22); }
.ceec-page-resources .gencover__band span { position:relative; z-index:1; font-family:var(--font-mono); font-size:7px; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.75); }
.ceec-page-resources .gencover__band i { position:relative; z-index:1; font-size:15px; color:var(--orange-soft); }
.ceec-page-resources .gencover__body { display:flex; flex-direction:column; gap:5px; padding:9px 11px 0; min-height:0; text-align:left; }
.ceec-page-resources .gencover__type { font-family:var(--font-mono); font-size:7px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--orange-deep); }
.ceec-page-resources .gencover__title { font-family:var(--font-display); font-size:10.5px; font-weight:700; line-height:1.25; color:var(--ink); display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
.ceec-page-resources .rcard .thumb.is-video { height:150px; position:relative; overflow:hidden; }
.ceec-page-resources .rcard .thumb.is-video img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ceec-page-resources .rcard .rby { font-size:13px; color:var(--text-soft); }
.ceec-page-resources .rtab__n { margin-left:4px; font-family:var(--font-mono); font-size:11.5px; font-weight:500; opacity:.7; }
.ceec-page-resources .toolbar { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:16px; }
@media (max-width:1000px){ .ceec-page-resources .toolbar { grid-template-columns:1fr 1fr; } }
@media (max-width:700px){ .ceec-page-resources .toolbar { grid-template-columns:1fr; } }
.ceec-page-resources .toolbar select { border:1px solid var(--panel-border); border-radius:var(--radius-md); padding:12px 14px; font-size:14.5px; font-family:var(--font-sans); color:var(--ink); outline:none; cursor:pointer; background:#fff; }
.ceec-page-resources .toolbar select:focus { border-color:var(--primary); }
.ceec-page-resources .filter-note { margin-top:12px; font-size:12.5px; color:var(--text-soft); display:flex; align-items:center; gap:7px; }
.ceec-page-resources .filter-note i { color:var(--orange-deep); font-size:15px; }

/* multi-select filters: topics and technologies combine, matching the format tabs */
.ceec-page-resources .msel { position:relative; }
.ceec-page-resources .msel__btn { display:flex; width:100%; justify-content:space-between; align-items:center; gap:9px; border:1.5px solid var(--panel-border); background:#fff; border-radius:var(--radius-md); padding:11px 15px; font-family:var(--font-sans); font-size:14px; font-weight:500; color:var(--text); cursor:pointer; transition:all .2s; }
.ceec-page-resources .msel__btn:hover { border-color:var(--teal-soft); }
.ceec-page-resources .msel__btn i { font-size:14px; color:var(--text-soft); transition:transform .2s; }
.ceec-page-resources .msel.open .msel__btn { border-color:var(--primary); }
.ceec-page-resources .msel.open .msel__btn i { transform:rotate(180deg); }
.ceec-page-resources .msel__btn.has { border-color:var(--primary); color:var(--primary); font-weight:600; }
.ceec-page-resources .msel__panel { display:none; position:absolute; z-index:60; top:calc(100% + 6px); left:0; min-width:250px; max-height:290px; overflow-y:auto; background:#fff; border:1px solid var(--panel-border); border-radius:var(--radius-lg); box-shadow:var(--shadow-lg); padding:8px; }
.ceec-page-resources .msel.open .msel__panel { display:block; }
.ceec-page-resources .msel__opt { display:flex; align-items:center; gap:10px; padding:9px 11px; border-radius:var(--radius-sm); font-size:14px; color:var(--text); cursor:pointer; }
.ceec-page-resources .msel__opt:hover { background:var(--muted); }
.ceec-page-resources .msel__opt input { accent-color:var(--primary); width:16px; height:16px; cursor:pointer; flex:none; }
.ceec-page-resources .msel__opt .cnt { margin-left:auto; font-family:var(--font-mono); font-size:11px; color:var(--text-soft); }

/* active filter chips + clear all */
.ceec-page-resources .active-filters { margin-top:14px; display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.ceec-page-resources .active-filters .afl { font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-soft); }
.ceec-page-resources .active-filters .af { display:inline-flex; align-items:center; gap:7px; background:var(--muted); border:1px solid var(--panel-border); border-radius:999px; padding:6px 12px; font-size:13px; color:var(--ink); }
.ceec-page-resources .active-filters .af button { border:none; background:none; padding:0; display:grid; place-items:center; cursor:pointer; color:var(--text-soft); font-size:14px; line-height:1; }
.ceec-page-resources .active-filters .af button:hover { color:var(--destructive); }
.ceec-page-resources .active-filters .af-clear { border:none; background:none; font-family:var(--font-sans); font-size:13px; font-weight:600; color:var(--orange-deep); cursor:pointer; padding:6px 4px; }
.ceec-page-resources .active-filters .af-clear:hover { text-decoration:underline; }
.ceec-page-resources .lib-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin-top:22px; }
@media (max-width:620px){ .ceec-page-resources .lib-grid { grid-template-columns:1fr; } }
.ceec-page-resources .lib-empty { grid-column:1/-1; text-align:center; padding:40px; color:var(--text-soft); font-size:15px; }
.ceec-page-resources .rcard { text-decoration:none; color:inherit; cursor:pointer; }
/* podcasts + videos live in the same library, colour-coded, with a play affordance over the real thumbnail */
.ceec-page-resources .rcard .thumb { position:relative; }
.ceec-page-resources .rcard .thumb .play { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); height:42px; width:42px; border-radius:50%; background:rgba(0,0,0,.4); border:1px solid rgba(255,255,255,.7); display:grid; place-items:center; color:#fff; }
.ceec-page-resources .rcard .thumb .play i { font-size:18px; }
.ceec-page-resources .tag.pod { background:rgba(233,97,21,.1); color:var(--orange-deep); border-color:rgba(233,97,21,.3); }
.ceec-page-resources .tag.vid { background:rgba(0,68,85,.07); color:var(--primary); border-color:rgba(0,68,85,.25); }

.ceec-page-resources .newsletter { text-align:center; border:1px solid var(--panel-border); border-radius:var(--radius-2xl); padding:clamp(32px,5vw,48px); background:var(--cream); }
.ceec-page-resources .newsletter h2 { font-size:clamp(22px,3vw,30px); font-weight:800; }
.ceec-page-resources .nl-form { margin-top:18px; display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }
.ceec-page-resources .nl-form input { border:1px solid var(--panel-border); border-radius:var(--radius-md); padding:13px 18px; font-size:14.5px; min-width:280px; font-family:var(--font-sans); }
/* Handoff: Browse the Library first at two-thirds, Featured the secondary
column that hides when empty. This order was a specific client decision. */
.ceec-page-resources .lib-layout { display:grid; grid-template-columns:2fr 1fr; gap:36px; align-items:start; margin-top:8px; }
@media (max-width:900px){ .ceec-page-resources .lib-layout { grid-template-columns:1fr; } }
.ceec-page-resources .lib-grid { grid-template-columns:repeat(2,1fr); }
@media (max-width:620px){ .ceec-page-resources .lib-grid { grid-template-columns:1fr; } }
/* nothing featured: the column hides and the library takes the full width */
.ceec-page-resources .lib-layout.no-feat { grid-template-columns:1fr; }
.ceec-page-resources .lib-layout.no-feat .feat-col { display:none; }
.ceec-page-resources .lib-layout.no-feat .lib-grid { grid-template-columns:repeat(3,1fr); }
@media (max-width:1000px){ .ceec-page-resources .lib-layout.no-feat .lib-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:620px){ .ceec-page-resources .lib-layout.no-feat .lib-grid { grid-template-columns:1fr; } }
