/* Refinery evidence uses the existing AIN palette and type, with scoped rules. */
.refinery-feature { background: var(--bg-2); border-block: 1px solid var(--line); }
.refinery-layout { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); align-items: start; gap: clamp(28px, 4vw, 64px); }
.refinery-layout > *, .refinery-methods > * { min-width: 0; }
.refinery-feature h2 { margin: 0 0 20px; font-size: clamp(1.75rem, 3.2vw, 2.8rem); line-height: 1.2; text-wrap: balance; }
.refinery-feature p, .refinery-page p, .refinery-page li { color: var(--accent-2); line-height: 1.8; max-width: 72ch; }
.refinery-feature h3 { margin: 20px 0 6px; font-size: 1.08rem; line-height: 1.45; }
.refinery-feature .pill-row { margin-block: 20px; }
.refinery-figure { margin: 0; }
.refinery-player { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 12px; background: #191919; }
.refinery-player > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.refinery-player::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, transparent 30%, rgba(0,0,0,.72)); }
.refinery-player[data-loaded]::after { display: none; }
.refinery-player > iframe { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; border: 0; }
.refinery-play { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1; display: flex; align-items: center; justify-content: center; width: 88px; height: 88px; padding: 0; border: 2px solid #fff; border-radius: 50%; background: #fff; color: #191919; cursor: pointer; }
.refinery-play svg { width: 36px; height: 36px; flex: none; fill: currentColor; transform: translateX(2px); }
/* Keep the localized action name available to assistive technology. */
.refinery-play span { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.refinery-play:hover { background: #EDEFF7; }
.refinery-play[hidden] { display: none; }
.no-js .refinery-play { display: none; }
.refinery-play:focus-visible { outline: 3px solid #191919; outline-offset: 6px; border-radius: 50%; box-shadow: 0 0 0 6px #fff; }
.refinery-figure figcaption { padding-block: 14px; color: var(--accent-2); font-size: .875rem; line-height: 1.7; }
.refinery-figure figcaption a, .refinery-page a:not(.btn), .refinery-note a { color: var(--txt); text-decoration: underline; text-underline-offset: 3px; }
.refinery-figure figcaption p { margin: 0; }
.refinery-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 24px; }
.refinery-actions .btn { white-space: normal; text-align: center; }
.refinery-note { margin-top: 20px; padding: 18px 20px; border: 1px solid var(--line-strong); border-radius: 12px; background: var(--surface); color: var(--accent-2); font-size: .9rem; line-height: 1.8; }
.refinery-page h1 { max-width: 27ch; margin: 20px 0 24px; }
.refinery-page h2 { margin-bottom: 24px; text-wrap: balance; }
.refinery-page h3 { margin-block: 24px 10px; font-size: 1.2rem; line-height: 1.45; }
.refinery-methods { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 48px; }
.refinery-methods article { padding-top: 20px; border-top: 1px solid var(--line-strong); }
.refinery-methods article h3 { margin-top: 0; }
.refinery-page ul, .refinery-page ol { padding-inline-start: 24px; display: grid; gap: 10px; }
.refinery-page ul { list-style: disc; }
.refinery-page ol { list-style: decimal; }
.refinery-page details { border-block-end: 1px solid var(--line-strong); padding-block: 20px; }
.refinery-page summary { font-weight: 600; color: var(--txt); font-size: 1.08rem; cursor: pointer; line-height: 1.6; }
.refinery-page details p { margin-top: 12px; }
.refinery-page summary:focus-visible { outline: 2px solid var(--txt); outline-offset: 6px; }
.refinery-benchmarks { margin-top: 36px; padding-top: 28px; border-top: 1px solid var(--line-strong); }
.refinery-benchmarks h3 { margin: 0 0 12px; font-size: 1.2rem; line-height: 1.45; }
.refinery-benchmarks .refinery-benchmark-note, .refinery-benchmarks .refinery-benchmark-summary { max-width: none; font-size: .9rem; line-height: 1.75; color: var(--accent-2); }
.refinery-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; margin-block: 24px; }
.refinery-metrics > div { display: grid; grid-template-rows: auto auto 1fr; align-content: start; min-width: 0; }
.refinery-metrics dt { grid-row: 2; margin-block: 8px 12px; font-size: .9rem; font-weight: 600; line-height: 1.5; color: var(--txt); }
.refinery-metrics dd { margin: 0; }
.refinery-metrics .refinery-metric-number { grid-row: 1; font-size: clamp(1.9rem, 3vw, 2.4rem); line-height: 1.2; letter-spacing: normal; color: var(--txt); white-space: nowrap; }
.refinery-metric-prefix { display: block; margin-bottom: 6px; font: 500 .875rem/1.5 var(--font-body); }
.refinery-metric-context { grid-row: 3; font-size: .875rem; line-height: 1.75; color: var(--accent-2); }
.refinery-metric-context a { color: var(--txt); text-decoration: underline; text-underline-offset: 3px; }
.refinery-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
/* Keep the index overview proportional; the dedicated case retains full detail. */
.refinery-feature--case { padding-block: clamp(56px, 5vw, 80px); }
.refinery-feature--case h2 { margin-bottom: 12px; font-size: clamp(1.65rem, 2.6vw, 2.2rem); line-height: 1.2; }
.refinery-feature--case p { font-size: .95rem; line-height: 1.65; }
.refinery-feature--case .mono-label { font-size: .75rem; margin-bottom: 12px; }
.refinery-feature--case .refinery-layout { gap: clamp(24px, 3vw, 48px); }
.refinery-feature--case .refinery-case-summary { margin-top: 12px; }
.refinery-case-summary p + p { margin-top: 8px; }
.refinery-feature--case .refinery-actions { margin-top: 18px; }
.refinery-feature--case figcaption { padding-block: 10px; }
.refinery-feature--case figcaption p { font-size: .84rem; }
.refinery-benchmarks--compact { margin-top: 20px; padding-top: 16px; }
.refinery-benchmarks--compact h3 { margin-bottom: 6px; font-size: 1rem; scroll-margin-top: 120px; }
.refinery-benchmarks--compact .refinery-benchmark-note { font-size: .84rem; line-height: 1.6; }
.refinery-benchmarks--compact .refinery-metrics { gap: 20px; margin-block: 16px 0; }
.refinery-benchmarks--compact .refinery-metric-number { font-size: 1.9rem; }
.refinery-benchmarks--compact .refinery-metric-prefix { display: inline; margin: 0; margin-inline-end: 6px; }
.refinery-benchmarks--compact dt { margin-block: 6px 8px; font-size: .84rem; }
.refinery-benchmarks--compact .refinery-metric-context { font-size: .82rem; line-height: 1.6; }
[dir="rtl"] .refinery-play { font-family: "IBM Plex Sans Arabic", "Manrope", sans-serif; }
[dir="rtl"] .refinery-metric-prefix { font-family: "IBM Plex Sans Arabic", "Manrope", sans-serif; }
[dir="rtl"] .refinery-feature h2, [dir="rtl"] .refinery-feature h3, [dir="rtl"] .refinery-page h1, [dir="rtl"] .refinery-page h2, [dir="rtl"] .refinery-page h3 { letter-spacing: normal; text-transform: none; }
@media (max-width: 900px) {
  .refinery-layout { grid-template-columns: minmax(0, 1fr); }
  .refinery-feature h2 { max-width: 32ch; }
}
@media (max-width: 620px) {
  .refinery-methods { grid-template-columns: minmax(0, 1fr); }
  .refinery-metrics { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .refinery-metrics > div + div { padding-top: 24px; border-top: 1px solid var(--line); }
  .refinery-benchmarks--compact .refinery-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
  .refinery-benchmarks--compact .refinery-metrics > div + div { padding-top: 0; border: 0; }
  .refinery-benchmarks--compact .refinery-metric-number { font-size: 1.4rem; }
  .refinery-benchmarks--compact .refinery-metric-prefix { display: block; margin-bottom: 4px; }
  .refinery-actions { align-items: stretch; }
  .refinery-actions .btn { width: 100%; }
  .refinery-play { width: 64px; height: 64px; }
  .refinery-play svg { width: 28px; height: 28px; }
}
