/* Scoped reading library; titles and actions stay visible on touch and without motion. */
.reading-library { --reading-ink: #10263d; --reading-muted: #465564; --reading-paper: #fbf8f3; color: var(--reading-ink); background: #fff; }
.reading-library__hero { background: var(--reading-paper); border-bottom: 1px solid #e6e2db; }
.reading-library__hero-inner { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; width: min(100% - 3rem, 80rem); margin-inline: auto; padding-block: clamp(3rem, 6vw, 5.5rem); }
.reading-library__opening { min-width: 0; }
.reading-library h1 { margin: .75rem 0 1.5rem; color: var(--reading-ink); font-size: clamp(2.6rem, 5.4vw, 5.25rem); letter-spacing: -.055em; line-height: 1; overflow-wrap: break-word; }
.reading-library__intro { max-width: 36rem; margin: 0; color: var(--reading-muted); font-size: clamp(1.0625rem, 1.3vw, 1.25rem); line-height: 1.7; }
.reading-library__statement { margin: 1.6rem 0; color: #077285; font-size: clamp(1.5rem, 2.8vw, 2.25rem); font-weight: 700; letter-spacing: -.035em; }
.reading-library__jumps { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; }
.reading-library__jumps a { display: inline-flex; gap: 1.25rem; align-items: center; min-height: 2.75rem; color: var(--reading-ink); font-weight: 700; text-decoration: none; border-bottom: 2px solid #eb7339; }
.reading-library__jumps a span { font-size: 1.4rem; }
.reading-library__hero-image { margin: 0; padding: .65rem .65rem 0; background: #fff; border: 1px solid #e1dcd3; transform: rotate(2deg); box-shadow: 0 1.25rem 3rem rgb(16 38 61 / 12%); }
.reading-library__hero-image img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.reading-library__hero-image figcaption { padding: 1rem .5rem; color: #465564; font-size: .75rem; letter-spacing: .05em; }
.reading-library__inner { width: min(100% - 3rem, 80rem); margin-inline: auto; padding-block: clamp(3rem, 6vw, 5rem); }
.reading-library__paths { padding-bottom: clamp(3rem, 6vw, 5rem); margin-bottom: clamp(3rem, 6vw, 5rem); border-bottom: 1px solid #dce4e6; }
.reading-library__section-heading { display: grid; grid-template-columns: minmax(0, 1fr) minmax(16rem, .7fr); gap: 2rem; align-items: end; margin-bottom: 2rem; }
.reading-library__section-heading h2 { margin: .5rem 0 0; color: var(--reading-ink); font-size: clamp(1.85rem, 3.5vw, 3rem); letter-spacing: -.04em; line-height: 1.1; }
.reading-library__section-heading > p { margin: 0; color: var(--reading-muted); line-height: 1.7; }
.reading-library__path-grid { display: grid; grid-template-columns: minmax(0, 1.8fr) minmax(0, 1fr); gap: 2rem; }
.reading-library__path-grid:has(> :only-child) { grid-template-columns: minmax(0, 1fr); }
.reading-path-list { align-self: center; }
.reading-path-list ul { list-style: none; padding: 0; margin: .5rem 0 0; }
.reading-path-list li { border-bottom: 1px solid #dce4e6; }
.reading-path-list a { display: flex; gap: 1rem; align-items: center; justify-content: space-between; min-height: 3rem; padding: 1rem 0; color: var(--reading-ink); font-weight: 650; font-size: 1rem; line-height: 1.4; text-decoration: none; }
.reading-path-list a span:last-child { color: #077285; font-size: 1.4rem; }
.reading-topics { display: flex; flex-wrap: wrap; gap: .65rem; margin: 0 0 2rem; }
.reading-topics a { display: inline-flex; align-items: center; min-height: 2.75rem; padding: .5rem .9rem; border: 1px solid #d1dade; border-radius: 999px; background: #fff; color: var(--reading-ink); font-size: .85rem; font-weight: 650; text-decoration: none; }
.reading-topics a[aria-current="page"] { border-color: var(--reading-ink); background: var(--reading-ink); color: #fff; }
.reading-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.reading-card { min-width: 0; border: 1px solid #dce4e6; border-radius: .35rem .35rem 1.25rem .35rem; overflow: hidden; background: #fff; transition: border-color 180ms ease, box-shadow 180ms ease; }
.reading-card__link { display: flex; flex-direction: column; min-width: 0; height: 100%; color: inherit; text-decoration: none; }
.reading-card__media { position: relative; overflow: hidden; aspect-ratio: 3 / 2; background: var(--reading-paper); }
.reading-card__media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 350ms ease; }
.reading-card__format { position: absolute; left: 1rem; bottom: 1rem; max-width: calc(100% - 2rem); padding: .4rem .65rem; border-radius: .25rem; color: var(--reading-ink); background: rgb(255 255 255 / 95%); font-size: .7rem; font-weight: 750; letter-spacing: .055em; text-transform: uppercase; }
.reading-card__copy { display: flex; flex: 1; min-width: 0; flex-direction: column; padding: clamp(1.25rem, 2vw, 1.75rem); }
.reading-card__meta { display: flex; flex-wrap: wrap; gap: .5rem 1rem; justify-content: space-between; color: #53616c; font-size: .75rem; line-height: 1.5; }
.reading-card__meta > span { color: #077285; font-weight: 700; }
.reading-card h3 { margin: .8rem 0 0; color: var(--reading-ink); font-size: clamp(1.3rem, 1.8vw, 1.65rem); line-height: 1.18; letter-spacing: -.025em; overflow-wrap: break-word; }
.reading-card__copy > p { margin: 1rem 0 1.5rem; color: var(--reading-muted); font-size: .95rem; line-height: 1.65; }
.reading-card__action { display: flex; gap: 1rem; align-items: center; justify-content: space-between; margin-top: auto; padding-top: 1rem; border-top: 1px solid #dce4e6; color: #077285; font-size: .85rem; font-weight: 700; }
.reading-card__arrow { display: grid; width: 2.5rem; height: 2.5rem; flex-shrink: 0; place-items: center; border: 1px solid #087b90; border-radius: 50%; font-size: 1.2rem; transition: background 180ms ease, color 180ms ease; }
.reading-card--lead { grid-column: span 2; }
.reading-card--lead .reading-card__link, .reading-card--path .reading-card__link { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.reading-card--lead .reading-card__media, .reading-card--path .reading-card__media { height: 100%; min-height: 20rem; aspect-ratio: auto; }
.reading-card--path { background: var(--reading-paper); }
.reading-card--path .reading-card__copy { padding: clamp(1.5rem, 3vw, 3rem); justify-content: center; }
.reading-card--path h3 { max-width: 22ch; font-size: clamp(1.5rem, 2vw, 2rem); }
.reading-card--path .reading-card__action { margin-top: 1rem; }
.reading-library a:focus-visible { outline: 3px solid #087b90; outline-offset: 4px; }
.reading-card__link:focus-visible { outline-offset: -4px; }
@media (hover: hover) and (pointer: fine) {
  .reading-card:hover { border-color: #8eabb4; box-shadow: 0 1rem 2rem rgb(16 38 61 / 8%); }
  .reading-card:hover .reading-card__media img { transform: scale(1.035); }
  .reading-card:hover .reading-card__arrow { color: #fff; background: #087b90; }
  .reading-topics a:hover { border-color: #087b90; }
}
@media (max-width: 64rem) { .reading-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .reading-library__hero-inner { gap: 2rem; } }
@media (max-width: 48rem) {
  .reading-library__hero-inner, .reading-library__inner { width: min(100% - 2rem, 80rem); }
  .reading-library__hero-inner { grid-template-columns: minmax(0, 1fr); gap: 2rem; padding-block: 2.5rem; }
  .reading-library h1 { font-size: clamp(2.4rem, 10vw, 4rem); }
  .reading-library__hero-image { margin-inline: .5rem; transform: rotate(1deg); }
  .reading-library__section-heading { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .reading-library__path-grid { grid-template-columns: minmax(0, 1fr); }
  .reading-grid { grid-template-columns: minmax(0, 1fr); }
  .reading-card--lead { grid-column: auto; }
  .reading-card--lead .reading-card__link, .reading-card--path .reading-card__link { display: flex; }
  .reading-card--lead .reading-card__media, .reading-card--path .reading-card__media { min-height: 0; height: auto; aspect-ratio: 3 / 2; }
  .reading-card--path h3 { font-size: 1.65rem; }
}
@media (prefers-reduced-motion: reduce) { .reading-card, .reading-card__media img, .reading-card__arrow { transition: none; } .reading-card:hover .reading-card__media img { transform: none; } }

/* Full-cover article artwork; the gradient protects text and territory photos stay separate. */
.blog-single__hero--illustrated { position: relative; isolation: isolate; display: flex; min-height: clamp(33rem, 70vh, 45rem); align-items: center; overflow: hidden; background: #10263d; }
.blog-single__hero--illustrated .blog-single__hero-inner { position: relative; z-index: 2; display: block; width: min(100% - 3rem, 80rem); padding: clamp(4rem, 7vw, 6.5rem) 0; }
.blog-single__hero--illustrated .blog-single__hero-copy { max-width: 43rem; }
.blog-single__hero--illustrated h1 { max-width: 20ch; color: #f7fbfc; font-size: clamp(2.6rem, 4.8vw, 4.3rem); line-height: 1.02; text-shadow: 0 .15rem 1rem rgb(0 0 0 / 12%); }
.blog-single__hero--illustrated .eyebrow, .blog-single__hero--illustrated .eyebrow a { color: #a9edf3; }
.blog-single__hero--illustrated .blog-single__lead { max-width: 39rem; margin-top: 1.5rem; color: #e8f0f2; font-size: clamp(1.0625rem, 1.5vw, 1.25rem); }
.blog-single__hero--illustrated .blog-single__meta { color: #d0e0e5; }
.article-hero-art { position: absolute; z-index: 0; inset: 0; margin: 0; pointer-events: none; overflow: hidden; }
.article-hero-art::after { position: absolute; content: ""; inset: 0; background: linear-gradient(90deg, rgb(9 28 44 / 97%) 0%, rgb(9 28 44 / 90%) 27%, rgb(9 28 44 / 65%) 49%, rgb(9 28 44 / 14%) 75%, rgb(9 28 44 / 6%) 100%), linear-gradient(0deg, rgb(9 28 44 / 22%), transparent 50%); }
.article-hero-art img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 65% 50%; animation: article-art-arrival 900ms cubic-bezier(.2, .7, .2, 1) both; }
@keyframes article-art-arrival { from { transform: scale(1.035); } to { transform: scale(1); } }
@media (max-width: 48rem) {
  .blog-single__hero--illustrated { min-height: 42rem; align-items: flex-end; }
  .blog-single__hero--illustrated .blog-single__hero-inner { width: calc(100% - 2rem); padding: 15rem 0 2.5rem; }
  .blog-single__hero--illustrated h1 { font-size: clamp(2.15rem, 9vw, 3.5rem); }
  .article-hero-art img { object-position: 62% 0; }
  .article-hero-art::after { background: linear-gradient(180deg, rgb(9 28 44 / 12%) 0%, rgb(9 28 44 / 35%) 17%, rgb(9 28 44 / 90%) 37%, #091c2c 68%); }
}
@media (prefers-reduced-motion: reduce) { .article-hero-art img { animation: none; } }

/* Related readings keep their current layout, now with individual full-card artwork. */
.blog-related .blog-card--art-cover { isolation: isolate; background: #10263d; }
.blog-card__backdrop { position: absolute; z-index: 0; inset: 0; overflow: hidden; pointer-events: none; }
.blog-card__backdrop img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform 550ms cubic-bezier(.22, 1, .36, 1); }
.blog-card__backdrop::after { position: absolute; z-index: 1; content: ""; inset: 0; background: radial-gradient(ellipse at 85% 95%, rgb(62 159 177 / 18%), transparent 65%), linear-gradient(180deg, rgb(9 38 51 / 28%) 0%, rgb(12 54 70 / 78%) 25%, rgb(13 63 79 / 86%) 60%, rgb(24 91 109 / 92%) 100%); }
.blog-card__backdrop::before { position: absolute; z-index: 2; content: ""; inset: -15% -25%; background: repeating-linear-gradient(36deg, transparent 0 82px, rgb(189 239 244 / 14%) 82px 83px), repeating-linear-gradient(124deg, transparent 0 65px, rgb(189 239 244 / 14%) 65px 66px); opacity: .6; transform: rotate(-7deg); -webkit-mask-image: radial-gradient(ellipse at 65% 90%, #000 15%, transparent 72%); mask-image: radial-gradient(ellipse at 65% 90%, #000 15%, transparent 72%); }
.blog-related .blog-card--art-cover .blog-card__body { position: relative; z-index: 1; }
.blog-related .blog-card--art-cover :is(h2, h3, h2 a, h3 a, .blog-card__meta, .blog-card__link, .blog-card__format),
.blog-related .blog-card--art-cover:is(:hover, :focus-within) :is(h2, h3, h2 a, h3 a, .blog-card__meta, .blog-card__link, .blog-card__format) { color: #f7fbfc; }
.blog-related .blog-card--art-cover .blog-card__body > p,
.blog-related .blog-card--art-cover:is(:hover, :focus-within) .blog-card__body > p { color: #e1ecef; }
.blog-related .blog-card--art-cover .blog-card__category { color: #bdeff4; background: rgb(255 255 255 / 14%); }
.blog-related .blog-card--art-cover .blog-card__format-icon { background: rgb(255 255 255 / 18%); }
.blog-related .blog-card--art-cover .blog-card__link { border-color: rgb(255 255 255 / 25%); }
.blog-related .blog-card--art-cover .blog-card__arrow { color: #10263d; background: #fff; }
.blog-related .blog-card--art-cover a:focus-visible { outline: 3px solid #bdeff4; outline-offset: 3px; }
@media (hover: hover) and (pointer: fine) { .blog-card--art-cover:is(:hover, :focus-within) .blog-card__backdrop img { transform: scale(1.045); } }
@media (hover: none), (pointer: coarse) { .blog-related .blog-card--art-cover .blog-card__body { min-height: 28rem; padding-top: 9rem; } }
@media (prefers-reduced-motion: reduce) { .blog-card__backdrop img { transition: none; } .blog-card--art-cover:is(:hover, :focus-within) .blog-card__backdrop img { transform: none; } }