/* Core Research Focus */
.focus { padding-top: 0; }
.focus .inner { max-width: var(--maxw); margin: 0 auto; padding: 0 1rem 2rem; }
.focus-head { display: grid; justify-items: center; gap: 0.5rem; padding: 0.75rem 0 1rem; text-align: center; }
.focus-head h2 { font-size: 1.35rem; font-weight: 700; letter-spacing: 0.01em; }
.focus-note { color: var(--muted); font-size: 0.95rem; }

.focus-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 1rem; }
@media (max-width: 960px) { .focus-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 640px) { .focus-grid { grid-template-columns: 1fr; } }

.focus-card { position: relative; background: var(--card); border: 1px solid var(--border); border-radius: 14px; overflow: clip; padding: 1rem; display: grid; grid-template-columns: auto 1fr; column-gap: 0.9rem; row-gap: 0.35rem; align-items: start; transition: box-shadow 160ms ease, transform 160ms ease; }
.focus-card::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: linear-gradient(90deg, var(--focus-accent, var(--accent)), transparent 60%); opacity: 0.9; }
.focus-card:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,0.06); }

.focus-icon { width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: color-mix(in oklab, var(--focus-accent, var(--accent)) 16%, transparent); color: var(--focus-accent, var(--accent)); border: 1px solid var(--border); }
.focus-icon svg { width: 28px; height: 28px; display: block; }

.focus-title { margin: 0; font-size: 1.1rem; letter-spacing: 0.005em; }
.focus-summary { grid-column: 1 / -1; margin: 0.1rem 0 0; color: var(--muted); }

/* Points list */
.focus-points { grid-column: 1 / -1; list-style: none; padding: 0; margin: 0.5rem 0 0; display: grid; gap: 0.3rem; }
.focus-points li { display: grid; grid-template-columns: 18px 1fr; align-items: start; column-gap: 0.4rem; color: var(--muted); }
.focus-points li::before { content: ""; width: 10px; height: 10px; border-radius: 50%; margin-top: 0.28rem; background: var(--focus-accent, var(--accent)); opacity: 0.8; box-shadow: 0 0 0 2px color-mix(in oklab, var(--focus-accent, var(--accent)) 18%, transparent); }

@media (prefers-reduced-motion: reduce) {
  .focus-card { transition: none; }
  .focus-card:hover { transform: none; box-shadow: none; }
}