/* /feasibility-studies pages. Tokens, type scale, .shell, .btn, .eyebrow, .data-label, .epc-chip and footer come from assets/site.css. */
.st-hero { padding-block: 3rem 3.5rem; }
@media (min-width: 640px) { .st-hero { padding-block: 4rem 4.5rem; } }
.crumbs { display: flex; flex-wrap: wrap; gap: 0.5rem; font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.06em; color: var(--c-fg-subtle); }
.crumbs li + li::before { content: '/'; margin-right: 0.5rem; color: var(--c-fg-subtle); }
.crumbs a { color: var(--c-fg-muted); text-decoration: underline; text-decoration-color: var(--c-line-strong); text-underline-offset: 3px; }
.crumbs a:hover { color: var(--c-fg); }
.st-question { display: grid; gap: 0.5rem; max-width: 46rem; margin-top: 2rem; padding-left: 1.25rem; border-left: 2px solid var(--c-accent); font-size: clamp(1.125rem, 1rem + 0.5vw, 1.375rem); line-height: 1.5; color: var(--c-fg); }
.st-meta { margin-top: 1.5rem; font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.06em; color: var(--c-fg-subtle); }

/* Headline figures: a ruled grid of four, two up on a phone */
.tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin-top: 2.5rem; overflow: hidden; border: 1px solid var(--c-line); border-radius: 14px; background: var(--c-line); }
@media (min-width: 1024px) { .tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.tiles > div { display: flex; flex-direction: column; gap: 0.5rem; padding: 1.25rem; background: var(--c-surface); }
.tiles .v { font-family: var(--font-mono); font-size: clamp(1.5rem, 1.2rem + 1vw, 2.25rem); font-weight: 500; line-height: 1; letter-spacing: -0.03em; color: var(--c-fg); }
.tiles .note { font-size: 0.875rem; line-height: 1.4; color: var(--c-fg-muted); }

/* Sections: heading left, reading column right on wide screens */
.st-section { padding-block: 3.5rem; border-top: 1px solid var(--c-line); }
.st-cols { display: grid; gap: 1.25rem 2.5rem; }
@media (min-width: 1024px) { .st-cols { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); } }
.st-prose { max-width: 46rem; font-size: 1.0625rem; line-height: 1.7; color: var(--c-fg-muted); }
.st-prose > * + * { margin-top: 1rem; }
.st-prose h3 { margin-top: 2rem; font-size: 1.125rem; font-weight: 500; color: var(--c-fg); }
.st-prose h3:first-child { margin-top: 0; }
.st-prose ol, .st-prose ul { display: grid; gap: 0.75rem; padding-left: 1.25rem; }
.st-prose ol { list-style: decimal; }
.st-prose ul { list-style: disc; }
.st-prose li::marker { color: var(--c-fg-subtle); font-family: var(--font-mono); font-size: 0.875em; }
.st-prose a, .st-links a, .st-table a { color: var(--c-accent-ink); text-decoration: underline; text-decoration-color: color-mix(in oklab, var(--c-accent) 40%, transparent); text-underline-offset: 3px; }
.st-prose a:hover, .st-links a:hover, .st-table a:hover { text-decoration-color: currentColor; }
.st-note { margin-top: 1rem; font-size: 0.875rem; line-height: 1.6; color: var(--c-fg-subtle); }
.st-links { display: grid; gap: 0.75rem; font-size: 1.0625rem; }

/* Figures: tables in a two-up grid; min-width 0 keeps a wide table scrolling inside its frame, not the page */
.st-grid { display: grid; gap: 1.5rem; align-items: start; }
@media (min-width: 1024px) { .st-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .st-wide { grid-column: 1 / -1; } }
.st-figure { min-width: 0; }
.table-wrap { overflow-x: auto; border: 1px solid var(--c-line); border-radius: 10px; background: var(--c-raised); }
.st-table { width: 100%; border-collapse: collapse; font-size: 0.875rem; line-height: 1.45; }
.st-table caption { padding: 0.875rem 1rem; text-align: left; font-family: var(--font-mono); font-size: 0.6875rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-fg-subtle); }
.st-table th, .st-table td { padding: 0.625rem 1rem; text-align: left; vertical-align: top; border-top: 1px solid var(--c-line); }
.st-table thead th { font-family: var(--font-mono); font-size: 0.6875rem; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-fg-subtle); }
.st-table tbody th { font-weight: 400; color: var(--c-fg); }
.st-table.is-pairs tbody th { width: 42%; }
.st-table td { color: var(--c-fg-muted); }
.st-table .n { text-align: right; font-family: var(--font-mono); white-space: nowrap; color: var(--c-fg); }
.st-table .sub { color: var(--c-fg-subtle); }
.band-bar { display: flex; height: 10px; margin-bottom: 0.75rem; overflow: hidden; border-radius: 3px; background: var(--c-line); }
.band-bar i { width: var(--w); min-width: 2px; background: var(--f); }

/* Hub: one card per study, the whole card is the link */
.study-cards { display: grid; gap: 1.25rem; }
@media (min-width: 768px) { .study-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .study-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.study-card { position: relative; display: flex; flex-direction: column; gap: 1rem; padding: 1.5rem; border: 1px solid var(--c-line); border-radius: 16px; background: var(--c-surface); transition: border-color var(--dur-base) var(--ease-precise); }
.study-card:hover, .study-card:focus-within { border-color: var(--c-line-strong); }
.study-card h3 a::after { content: ''; position: absolute; inset: 0; border-radius: 16px; }
.study-card h3 a:focus-visible { outline: none; }
.study-card:has(a:focus-visible) { outline: 2px solid var(--c-accent); outline-offset: 3px; }
.study-card p { font-size: 0.9375rem; line-height: 1.6; color: var(--c-fg-muted); }
.study-card dl { display: flex; flex-wrap: wrap; gap: 0.75rem 1.5rem; margin-top: auto; }
.study-card dd { margin-top: 0.25rem; font-family: var(--font-mono); font-size: 1.25rem; color: var(--c-fg); }
.study-card .more { display: inline-flex; align-items: center; gap: 0.5rem; font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-accent-ink); }

.st-cta { padding-block: 5rem; border-top: 1px solid var(--c-line); background: var(--c-raised); }
