/* Shared library controls and spacing, on the site-wide design tokens. */
@font-face { font-family:CargoOswald; src:url('../fonts/cargo-oswald-700.ttf') format('truetype'); font-weight:700; font-display:swap; }
.v2 .library-wrap { max-width:1600px; margin-inline:auto; padding-inline:clamp(20px,5vw,80px); }
.v2 .library-page { padding-block:clamp(40px,5vw,72px) var(--ds-section-gap); }
.v2 .library-page [hidden] { display:none!important; }
.v2 .library-page .sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.v2 .directory-heading { display:flex; justify-content:space-between; align-items:baseline; gap:20px; margin-bottom:36px; }
.v2 .directory-heading h1,.v2 .resources-heading h1 { font-size:var(--ds-display); line-height:1.08; }
.v2 .directory-heading>span { color:var(--v2-muted); font-size:var(--ds-label); }
.v2 .library-search { display:grid; grid-template-columns:minmax(0,1fr) minmax(200px,270px) auto; gap:12px; }
.v2 .search-field { display:flex; align-items:center; gap:12px; min-width:0; background:#fff; border:1px solid #d6d8d6; border-radius:var(--ds-radius-inner); padding-inline:16px; }
.v2 .search-field>svg { width:20px; height:20px; flex:none; color:#6b7479; }
.v2 .search-field input { width:100%; min-width:0; background:none; border:0; outline:none; height:52px; color:var(--v2-fg); font:400 1rem/1.4 var(--ds-font); }
.v2 .search-field:focus-within { outline:2px solid var(--v2-accent); outline-offset:2px; }
.v2 .select-field { min-width:0; }
.v2 .select-field select { width:100%; height:54px; padding:0 36px 0 16px; font:400 var(--ds-button)/1.4 var(--ds-font); color:var(--v2-fg); background:#fff; border:1px solid #d6d8d6; border-radius:var(--ds-radius-inner); cursor:pointer; text-overflow:ellipsis; }
.v2 .select-field select:focus-visible { outline:2px solid var(--v2-accent); outline-offset:2px; }
.v2 .library-search>.btn { height:54px; }
.v2 .library-results-bar { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:72px; font-size:var(--ds-label); color:var(--v2-muted); }
.v2 .library-results-bar a { display:flex; gap:16px; color:var(--v2-fg); min-height:44px; align-items:center; }
.v2 .library-results-bar a:hover { text-decoration:underline; text-underline-offset:4px; }
.v2 [data-directory-results] { transition:opacity 160ms; }
.v2 [data-directory-results][aria-busy=true] { opacity:.5; }
.v2 .directory-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.v2 .directory-card { display:flex; flex-direction:column; min-width:0; background:#fff; border:1px solid #e5e7e4; border-radius:var(--ds-radius); padding:28px; transition:border-color var(--ds-fast),transform var(--ds-hover) var(--ds-ease); }
.v2 .directory-card:hover { border-color:#aeb7c4; transform:translateY(-3px); }
.v2 .directory-card-top { display:flex; justify-content:space-between; align-items:start; gap:16px; margin-bottom:28px; }
.v2 .directory-logo { width:180px; max-width:calc(100% - 32px); height:66px; display:flex; align-items:center; justify-content:start; border-radius:8px; }
.v2 .directory-logo img { width:100%; height:100%; object-fit:contain; object-position:left center; }
.v2 .directory-logo-dark { background:#17232d; padding:10px; }
.v2 .directory-logo-invert img { filter:brightness(0); }
.v2 .directory-initial { font-size:2rem; color:#3155a2; }
.v2 .directory-arrow { font-size:22px; color:#717978; transition:transform var(--ds-hover) var(--ds-ease); }
.v2 .directory-card:hover .directory-arrow { transform:translate(2px,-2px); color:var(--v2-accent); }
.v2 .cargo-wordmark { color:#1b3549; font:700 22px/1.15 CargoOswald,sans-serif; }
.v2 .cargo-wordmark>span { color:#ed7327; }
.v2 .library-label { display:block; color:#637077; font-size:var(--ds-meta); line-height:1.5; }
.v2 .directory-card-copy { flex:1; }
.v2 .directory-card h2 { font-size:var(--ds-card-heading); line-height:1.2; margin-top:10px; text-wrap:pretty; }
.v2 .directory-card-copy p { color:#68706e; font-size:var(--ds-body); line-height:1.6; margin-top:16px; }
.v2 .directory-outcome { margin-top:24px; padding-top:18px; border-top:1px solid var(--v2-line); font-size:var(--ds-meta); color:#345545; }
.v2 .library-pagination { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:20px; margin-top:36px; border-top:1px solid var(--v2-line); padding-top:24px; }
.v2 .library-pagination>.btn { justify-self:start; }
.v2 .library-pagination>.btn:last-child { justify-self:end; }
.v2 .library-pagination>span { font-size:var(--ds-label); color:var(--v2-muted); }
.v2 .library-empty { grid-column:1/-1; display:grid; justify-items:center; text-align:center; gap:18px; padding:72px 24px; border-radius:var(--ds-radius); background:#fff; }
.v2 .library-empty :is(h2,h3) { font-size:var(--ds-feature-heading); }
.v2 .library-empty p { max-width:50ch; color:var(--v2-muted); }
.v2 .directory-error,.v2 .feed-note { padding:16px 0; color:#934936; font-size:var(--ds-label); }
.v2 .feed-note a { text-decoration:underline; text-underline-offset:4px; }
/* Editorial library */
.v2 .resources-heading { display:flex; align-items:end; justify-content:space-between; gap:32px; margin-bottom:36px; }
.v2 .resources-heading p { max-width:42ch; color:var(--v2-muted); font-size:var(--ds-lead); }
.v2 .resource-features { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(0,1fr); gap:16px; margin-bottom:var(--ds-section-gap); }
.v2 .resource-feature { display:flex; flex-direction:column; overflow:hidden; border-radius:var(--ds-radius); background:#fff; min-width:0; }
.v2 .resource-feature-image { height:clamp(230px,24vw,360px); background:#d5dce4; overflow:hidden; display:grid; place-items:center; }
.v2 .resource-feature-image img { width:100%; height:100%; object-fit:cover; transition:transform 650ms var(--ds-ease); }
.v2 .resource-feature:hover img { transform:scale(1.025); }
.v2 .resource-feature-copy { padding:var(--ds-card-padding); display:grid; gap:20px; }
.v2 .resource-feature h2 { font-size:var(--ds-feature-heading); line-height:1.24; text-wrap:pretty; }
.v2 .resource-read { display:flex; align-items:center; justify-content:space-between; gap:16px; font-size:var(--ds-label); margin-top:4px; }
.v2 .resource-art-mark { width:180px; }
.v2 .resource-art-mark svg { width:100%; }
.v2 .resource-book { background:#e0e6e9; border-radius:var(--ds-radius); padding:var(--ds-card-padding); display:flex; flex-direction:column; gap:24px; }
.v2 .resource-book-top { display:flex; justify-content:space-between; }
.v2 .resource-book-render { width:100%; height:clamp(210px,20vw,285px); display:block; flex:none; min-height:0; overflow:hidden; margin-block:-14px -8px; }
.v2 .resource-book-render img { width:100%; height:100%; object-fit:contain; transition:transform 600ms var(--ds-ease); }
.v2 .resource-book:hover .resource-book-render img { transform:translateY(-4px) rotate(-2deg); }
.v2 .resource-book>div:last-child { margin-top:auto; }
.v2 .resource-book h2 { font-size:var(--ds-card-heading); line-height:1.2; }
.v2 .resource-book p { color:#5f6c74; font-size:var(--ds-label); line-height:1.6; margin-block:16px 20px; }
.v2 .library-section-heading { display:flex; align-items:baseline; justify-content:space-between; gap:24px; margin-bottom:28px; }
.v2 .library-section-heading h2 { font-size:var(--ds-feature-heading); }
.v2 .library-section-heading a { font-size:var(--ds-label); color:var(--v2-muted); }
.v2 .library-section-heading a>span { margin-left:12px; }
.v2 .resource-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px 16px; }
.v2 .resource-card { display:flex; flex-direction:column; min-width:0; border-radius:var(--ds-radius); overflow:hidden; background:white; }
.v2 .resource-card-image { aspect-ratio:1.8; overflow:hidden; background:#dbe2e7; }
.v2 .resource-card-image img { width:100%; height:100%; object-fit:cover; transition:transform 600ms var(--ds-ease); }
.v2 .resource-card:hover img { transform:scale(1.035); }
.v2 .resource-card-art { display:flex; align-items:end; padding:28px; background:linear-gradient(140deg,#364d78,#162746); color:#fff; }
.v2 .resource-card:nth-child(3n+2) .resource-card-art { background:linear-gradient(140deg,#527469,#243e38); }
.v2 .resource-card:nth-child(3n) .resource-card-art { background:linear-gradient(140deg,#776753,#493b2b); }
.v2 .resource-card-art>span { font-size:1.75rem; line-height:1.1; letter-spacing:-.04em; }
.v2 .resource-card-copy { padding:24px; display:flex; flex-direction:column; flex:1; }
.v2 .resource-card h3 { font-size:var(--ds-card-heading); line-height:1.3; margin-top:14px; margin-bottom:28px; text-wrap:pretty; }
.v2 .resource-card-foot { display:flex; align-items:center; justify-content:space-between; font-size:var(--ds-meta); color:var(--v2-muted); margin-top:auto; }
.v2 .resource-newsletter { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:48px; margin-top:var(--ds-section-gap); padding:40px; background:#e2e8e3; border-radius:var(--ds-radius); }
.v2 .resource-newsletter h2 { font-size:var(--ds-feature-heading); margin-top:12px; }
.v2 .resource-newsletter>div>p { margin-top:16px; max-width:44ch; color:#59675c; font-size:var(--ds-label); }
.v2 .resource-newsletter label { display:block; font-size:var(--ds-label); margin-bottom:8px; }
.v2 .newsletter-controls { display:flex; align-items:center; gap:10px; }
.v2 .newsletter-controls input { min-width:0; width:100%; background:white; color:var(--v2-fg); border:1px solid #bdc8be; border-radius:var(--ds-radius-inner); height:48px; font-size:1rem; padding:0 16px; }
.v2 [data-newsletter-status] { margin-top:12px; font-size:var(--ds-label); }
.v2 .resource-library { scroll-margin-top:100px; }
@media(max-width:1100px) { .v2 .directory-grid,.v2 .resource-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .v2 .resource-features { grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); } }
@media(max-width:760px) { .v2 .directory-heading,.v2 .resources-heading { display:grid; gap:16px; margin-bottom:28px; } .v2 .library-search { grid-template-columns:minmax(0,1fr) auto; gap:10px; } .v2 .search-field { grid-column:1/-1; } .v2 .select-field select { height:48px; } .v2 .library-search>.btn { height:48px; } .v2 .resource-features,.v2 .resource-newsletter { grid-template-columns:1fr; } .v2 .resource-book { display:grid; grid-template-columns:auto 1fr; align-items:center; gap:24px; } .v2 .resource-book-top { grid-column:1/-1; } .v2 .resource-book-render { width:142px; height:175px; margin:0; } .v2 .resource-newsletter { gap:28px; padding:28px; } .v2 .library-section-heading { align-items:start; flex-direction:column; gap:12px; } }
@media(max-width:560px) { .v2 .directory-grid,.v2 .resource-grid { grid-template-columns:1fr; } .v2 .directory-card { padding:24px; } .v2 .directory-card-top { margin-bottom:20px; } .v2 .library-results-bar { font-size:var(--ds-meta); min-height:64px; } .v2 .library-results-bar>span { display:none; } .v2 .library-pagination { gap:8px; } .v2 .library-pagination .btn { padding-inline:16px; } .v2 .library-pagination>span { font-size:var(--ds-meta); } .v2 .resource-newsletter { padding:24px; } .v2 .newsletter-controls { flex-direction:column; align-items:stretch; } .v2 .resource-card-image { aspect-ratio:1.85; } }
@media(prefers-reduced-motion:reduce) { .v2 :is(.directory-card,.directory-arrow,.resource-feature-image img,.resource-book-render img,.resource-card-image img,[data-directory-results]) { transition:none; transform:none!important; } }

.v2 [data-directory-results] { scroll-margin-top:92px; }

/* Screenshots and the rendered book keep their full bounds. */
.v2 :is(.resource-card-image,.resource-feature-image).resource-image--product { background:#dce3ec; padding:20px; }
.v2 :is(.resource-card-image,.resource-feature-image).resource-image--product img { object-fit:contain; }
.v2 .resource-card-image.resource-image--book { background:#dfe6ed; padding:12px; }
.v2 .resource-card-image.resource-image--book img { object-fit:contain; }
@media(max-width:420px) {
  .v2 .resource-book { gap:18px; grid-template-columns:100px minmax(0,1fr); }
  .v2 .resource-book-render { width:118px; height:160px; margin-left:-16px; }
}