.statsally-resources {
	--sa-ink: var(--ink, #102a43);
	--sa-ink-2: var(--ink-2, #334e68);
	--sa-muted: var(--muted, #627d98);
	--sa-line: var(--line, #d9e2ec);
	--sa-brand: var(--brand, #08736a);
	--sa-brand-dark: var(--brand-dark, #055f58);
	--sa-surface: var(--surface-2, #f5f9f8);
	--sa-surface-strong: var(--surface-3, #e5f4ef);
	--sa-accent: var(--accent, #efa928);
	--sa-radius: var(--radius, 18px);
	--sa-radius-sm: var(--radius-sm, 12px);
	--sa-shadow: var(--shadow, 0 10px 30px rgba(16,42,67,.08));
}

.sa-resource-wrap { width: min(calc(100% - 2rem), 850px); margin-inline: auto; }
.sa-resource-hero { background: linear-gradient(135deg, var(--sa-surface-strong), #fff); }
.sa-resource-hero__lead { max-width: 850px; margin-bottom: .65rem; }
.sa-resource-hero__hint { margin: 0; color: var(--sa-muted); font-size: .96rem; font-weight: 650; }

.sa-resource-library { padding-top: clamp(2.4rem, 4vw, 3.75rem); }
.sa-resource-library-tools { display: grid; grid-template-columns: minmax(280px, 1.4fr) minmax(190px, .7fr) auto; gap: 1rem; align-items: end; padding: clamp(1rem, 2.5vw, 1.4rem); background: var(--sa-surface); border: 1px solid var(--sa-line); border-radius: 20px; box-shadow: 0 10px 30px rgba(16,42,67,.04); }
.sa-resource-library-tools--without-topics { grid-template-columns: minmax(280px, 1fr) auto; }
.sa-resource-library-search, .sa-resource-library-topic { display: grid; gap: .4rem; min-width: 0; }
.sa-resource-library-tools input, .sa-resource-library-tools select { min-height: 48px; border-color: #bcccdc; }
.sa-resource-library-tools input:focus, .sa-resource-library-tools select:focus { outline: 3px solid rgba(239,169,40,.8); outline-offset: 2px; border-color: var(--sa-brand); }
.sa-resource-library-actions { display: flex; flex-wrap: wrap; gap: .85rem; align-items: center; min-height: 48px; }
.sa-resource-library-actions .button { white-space: nowrap; }
.sa-resource-library-reset, .sa-resource-library-summary__active, .sa-resource-inline-link { color: var(--sa-brand-dark); font-size: .93rem; font-weight: 800; }
.sa-resource-library-reset { display: inline-flex; min-height: 44px; align-items: center; }
.sa-resource-library-reset:hover, .sa-resource-library-summary__active:hover, .sa-resource-inline-link:hover { color: var(--sa-brand); }

.sa-resource-library-summary { display: flex; flex-wrap: wrap; gap: .6rem 1rem; align-items: center; padding: 1.3rem 0 1.15rem; border-bottom: 1px solid var(--sa-line); }
.sa-resource-library-summary__count { margin: 0; color: var(--sa-ink); font-size: .96rem; font-weight: 850; }
.sa-resource-library-summary__active { padding: .25rem .6rem; background: var(--sa-surface-strong); border-radius: 999px; text-decoration: none; }

.sa-resource-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.4rem; margin-top: 1.6rem; }
.sa-resource-card { display: flex; height: 100%; flex-direction: column; overflow: hidden; background: #fff; border: 1px solid var(--sa-line); border-radius: var(--sa-radius); box-shadow: 0 9px 30px rgba(16,42,67,.05); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.sa-resource-card:hover, .sa-resource-card:focus-within { border-color: var(--sa-brand); box-shadow: var(--sa-shadow); transform: translateY(-2px); }
.sa-resource-card__media { position: relative; display: block; aspect-ratio: 16 / 7; overflow: hidden; color: white; background: linear-gradient(125deg, var(--sa-ink), #0a5f5c 58%, var(--sa-brand)); }
.sa-resource-card__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.sa-resource-card__cover { isolation: isolate; display: flex; align-items: flex-end; padding: 1.1rem 1.25rem; }
.sa-resource-card__cover::before, .sa-resource-card__cover::after { position: absolute; z-index: -1; content: ""; pointer-events: none; }
.sa-resource-card__cover::before { width: 180px; height: 180px; right: -82px; bottom: -128px; border: 1px solid rgba(255,255,255,.34); border-radius: 50%; box-shadow: 0 0 0 24px rgba(255,255,255,.06), 0 0 0 48px rgba(255,255,255,.035); }
.sa-resource-card__cover::after { width: 150%; height: 1px; top: 35px; left: -28%; background: rgba(255,255,255,.24); box-shadow: 0 22px 0 rgba(255,255,255,.14), 0 44px 0 rgba(255,255,255,.08); transform: rotate(-12deg); }
.sa-resource-card__cover-content { position: relative; z-index: 1; display: grid; max-width: calc(100% - 58px); gap: .14rem; }
.sa-resource-card__cover-kicker { color: #c8f5ea; font-size: .66rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.sa-resource-card__cover-topic { font-size: 1.05rem; font-weight: 800; line-height: 1.2; letter-spacing: -.01em; }
.sa-resource-card__cover-motif { position: absolute; right: 20px; bottom: 17px; width: 46px; height: 46px; border: 2px solid rgba(239,169,40,.86); border-radius: 50% 50% 50% 8px; transform: rotate(28deg); }
.sa-resource-card--variant-1 .sa-resource-card__cover { background: linear-gradient(135deg, #0b3a53 0%, #08736a 72%, #2d988a 100%); }
.sa-resource-card--variant-1 .sa-resource-card__cover::after { top: auto; bottom: 17px; left: 15%; width: 54%; box-shadow: 0 -20px 0 rgba(255,255,255,.16), 0 -40px 0 rgba(255,255,255,.08); transform: none; }
.sa-resource-card--variant-1 .sa-resource-card__cover-motif { border-radius: 8px; transform: rotate(45deg); }
.sa-resource-card--variant-2 .sa-resource-card__cover { background: linear-gradient(118deg, #173f5f 0%, #126e6a 52%, #0c8578 100%); }
.sa-resource-card--variant-2 .sa-resource-card__cover::before { width: 128px; height: 128px; top: -70px; right: 42px; bottom: auto; border-radius: 18px; transform: rotate(28deg); }
.sa-resource-card--variant-2 .sa-resource-card__cover::after { top: 48%; left: -18%; height: 36px; background: radial-gradient(circle at 11px 11px, rgba(255,255,255,.27) 0 2px, transparent 2.5px) 0 0 / 22px 22px; box-shadow: none; transform: none; }
.sa-resource-card--variant-2 .sa-resource-card__cover-motif { border-radius: 50%; box-shadow: 15px -15px 0 -10px rgba(239,169,40,.82); transform: none; }
.sa-resource-card--variant-3 .sa-resource-card__cover { background: linear-gradient(135deg, #16445f 0%, #166d72 58%, #08736a 100%); }
.sa-resource-card--variant-3 .sa-resource-card__cover::before { width: 230px; height: 96px; right: -36px; bottom: -57px; border-radius: 50%; transform: rotate(-12deg); }
.sa-resource-card--variant-3 .sa-resource-card__cover::after { top: 18px; left: 43%; width: 82px; height: 82px; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; background: transparent; box-shadow: none; transform: none; }
.sa-resource-card--variant-3 .sa-resource-card__cover-motif { border-width: 0 2px 2px 0; border-radius: 0; transform: rotate(-35deg); }

.sa-resource-card__body { display: flex; flex: 1; flex-direction: column; padding: 1.3rem; }
.sa-resource-card__meta { display: flex; flex-wrap: wrap; gap: .28rem .42rem; align-items: baseline; margin: 0 0 .7rem; color: var(--sa-muted); font-size: .81rem; font-weight: 700; line-height: 1.4; }
.sa-resource-card__separator { color: #9fb3c8; }
.sa-resource-card h2 { margin: 0 0 .7rem; color: var(--sa-ink); font-size: clamp(1.22rem, 1.8vw, 1.4rem); line-height: 1.25; letter-spacing: -.015em; }
.sa-resource-card h2 a { color: inherit; text-decoration: none; }
.sa-resource-card h2 a:hover { color: var(--sa-brand); }
.sa-resource-card__excerpt { margin: 0 0 1.25rem; color: var(--sa-ink-2); line-height: 1.6; }
.sa-resource-card__link { display: inline-flex; min-height: 44px; align-items: center; align-self: flex-start; margin-top: auto; color: var(--sa-brand-dark); font-weight: 850; text-decoration-thickness: .08em; text-underline-offset: .18em; }
.sa-resource-card__link:hover { color: var(--sa-brand); }

.sa-resource-empty-state { max-width: 780px; padding: clamp(2rem, 6vw, 4rem); margin: 1.6rem auto 0; background: var(--sa-surface); border: 1px solid var(--sa-line); border-radius: 24px; text-align: center; }
.sa-resource-empty-state h2 { margin-top: 0; color: var(--sa-ink); }
.sa-resource-empty-state p { color: var(--sa-ink-2); }
.sa-resource-empty-state__actions, .sa-resource-library-cta__actions { display: flex; flex-wrap: wrap; gap: .85rem 1rem; align-items: center; justify-content: center; margin-top: 1.4rem; }
.sa-resource-library-cta { padding-top: 0; }
.sa-resource-library-cta .cta { max-width: 1180px; margin-inline: auto; }
.sa-resource-library-cta .cta h2 { color: white; }
.sa-resource-library-cta .cta p { max-width: 790px; color: #d9e7ef; }
.sa-resource-library-cta .eyebrow { color: #bcebe2; }
.sa-resource-library-cta__actions { justify-content: flex-start; }
.sa-resource-library-cta__actions > a:not(.button) { color: white; font-weight: 800; }

.sa-resource-prose { color: var(--sa-ink); font-size: 1.08rem; }
.sa-resource-prose > * { max-width: 100%; }
.sa-resource-prose h2 { margin-top: 2.3em; }
.sa-resource-prose h3 { margin-top: 1.8em; }
.sa-resource-prose figure { margin: 2rem 0; }
.sa-resource-prose figcaption { margin-top: .6rem; color: var(--sa-muted); font-size: .9rem; }
.sa-resource-prose img { max-width: 100%; height: auto; border-radius: 12px; }
.sa-resource-featured-image img { width: 100%; }
.sa-resource-prose table { display: block; width: 100%; overflow-x: auto; border-collapse: collapse; }
.sa-resource-prose th, .sa-resource-prose td { padding: .7rem; border: 1px solid var(--sa-line); text-align: left; }
.sa-resource-prose th { background: var(--sa-surface); }
.sa-resource-prose pre { overflow: auto; padding: 1rem; color: #e8f1f8; background: var(--sa-ink); border-radius: 12px; }
.sa-resource-prose blockquote { padding: .3rem 1.2rem; margin: 1.5rem 0; border-left: 4px solid var(--sa-brand); background: var(--sa-surface); }
.sa-resource-prose .sa-resource-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: 1.5rem 0; }
.sa-resource-prose .sa-resource-card, .sa-resource-prose .sa-resource-callout, .sa-resource-prose .sa-resource-note { padding: 1.2rem; border: 1px solid var(--sa-line); border-radius: 14px; background: #fff; }
.sa-resource-prose .sa-resource-callout { border-color: #b8dcd6; background: var(--sa-surface-strong); }
.sa-resource-note { padding: 1.3rem 1.5rem; margin-top: 3rem; border-left: 4px solid var(--sa-accent); background: #fff8e9; border-radius: 10px; }
.sa-resource-note h2 { margin-top: 0; font-size: 1.2rem; }

@media (max-width: 980px) {
	.sa-resource-library-tools { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
	.sa-resource-library-tools--without-topics { grid-template-columns: minmax(0, 1fr) auto; }
	.sa-resource-library-tools:not(.sa-resource-library-tools--without-topics) .sa-resource-library-actions { grid-column: span 2; }
	.sa-resource-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
	.sa-resource-hero__hint { font-size: .9rem; }
	.sa-resource-library-tools, .sa-resource-library-tools--without-topics { grid-template-columns: 1fr; }
	.sa-resource-library-tools:not(.sa-resource-library-tools--without-topics) .sa-resource-library-actions { grid-column: auto; }
	.sa-resource-library-actions { align-items: flex-start; flex-direction: column; }
	.sa-resource-library-actions .button { width: 100%; }
	.sa-resource-grid, .sa-resource-prose .sa-resource-grid { grid-template-columns: 1fr; }
	.sa-resource-card__body { padding: 1.15rem; }
	.sa-resource-library-cta__actions, .sa-resource-empty-state__actions { align-items: flex-start; flex-direction: column; }
	.sa-resource-library-cta__actions .button, .sa-resource-empty-state__actions .button { width: 100%; }
	.sa-resource-prose { font-size: 1rem; }
}

@media (prefers-reduced-motion: reduce) {
	.sa-resource-card { transition: none; }
	.sa-resource-card:hover, .sa-resource-card:focus-within { transform: none; }
}
