/* White thematic backgrounds with content-height cards and a quiet reading area. */
.resource-masonry--editorial { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: auto; gap: 24px; align-items: start; }
.resource-card.resource-feature { position: relative; isolation: isolate; overflow: hidden; display: block; height: auto; padding: 0; color: #101416; background: #fff; border-radius: 10px; box-shadow: 0 10px 30px rgba(16,20,22,.08); }
.resource-feature .resource-art { position: absolute; z-index: -2; top: 50%; right: 0; left: 0; display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; transform: translateY(-50%); object-fit: contain; opacity: .7; mask-image: linear-gradient(180deg, transparent, #000 15%, #000 85%, transparent); }
.resource-feature::before { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, #fff 0%, #fff 38%, rgba(255,255,255,.85) 53%, rgba(255,255,255,0) 100%); }
.resource-feature__content { display: flex; flex-direction: column; align-items: flex-start; height: auto; padding: 22px 24px 20px; }
.resource-card.resource-feature p.resource-feature__source { max-width: 100%; min-height: 0; margin: 0 0 10px; color: #667075; font: 9px/1.4 Consolas, monospace; letter-spacing: .04em; overflow-wrap: anywhere; }
.resource-card.resource-feature h2 { max-width: 100%; margin: 0 0 10px; color: #101416; font-size: 24px; line-height: 1.12; letter-spacing: -.03em; font-weight: 600; overflow-wrap: anywhere; }
.resource-feature h2 a { color: inherit; }
.resource-feature__link::after { content: ""; position: absolute; z-index: 2; inset: 0; }
.resource-card.resource-feature p.resource-feature__description { max-width: 100%; margin: 0 0 12px; color: #536066; font-size: 13px; line-height: 1.4; }
.resource-feature__action { display: grid; place-items: center; align-self: flex-end; width: 28px; height: 28px; flex-shrink: 0; margin-top: 0; border: 1px solid #cbd4d3; border-radius: 50%; color: #536066; font-size: 18px; line-height: 1; }
.resource-feature:hover .resource-feature__action { border-color: #03b8c5; color: #008c98; }
.resource-feature:focus-within { outline: 3px solid #03b8c5; outline-offset: 4px; }
.resource-feature .resource-feature__link:focus-visible { outline: 0; }
.resource-masonry--editorial:has(.resource-feature:only-child) { grid-template-columns: minmax(0, 1fr); }
.resource-masonry--editorial .resource-feature:only-child { max-width: 760px; width: 100%; }
@media (max-width: 1100px) { .resource-masonry--editorial { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .resource-masonry--editorial { grid-template-columns: minmax(0, 1fr); gap: 18px; } .resource-feature__content { padding: 22px 22px 18px; } .resource-card.resource-feature h2 { max-width: 100%; font-size: 21px; } .resource-card.resource-feature p.resource-feature__description { max-width: 100%; } }