/* Research section: /backtests (overview) and /backtests/{free|alpha|enterprise} (one plan,
   paged). Own .bt-* classes, not Tailwind utilities: these pages load the purged
   styles2.css, where a utility it does not already contain silently does nothing.
   Bands use the header Research menu surfaces: white, pale violet (Alpha tier colour,
   docs/brand-identity.md), navy. */

.bt-wrap{ max-width:72rem; margin:0 auto; padding:0 1.25rem; }
@media (min-width:640px){ .bt-wrap{ padding:0 1.5rem; } }

/* Intro */
.bt-hero{ padding:7.5rem 0 3rem; background:linear-gradient(to bottom, #f4f4f5, #fff 16rem); }
@media (min-width:768px){ .bt-hero{ padding:9.5rem 0 3.5rem; } }
.bt-h1{ font-family:'Inter Tight', Inter, system-ui, sans-serif; font-size:clamp(2.4rem, 5vw, 3.4rem);
    font-weight:700; letter-spacing:-.035em; line-height:1.04; color:#18181b; margin:0 0 1rem; }
.bt-lede{ max-width:40rem; font-size:1.0625rem; line-height:1.65; color:#52525b; margin:0 0 2rem; }
.bt-crumb{ display:flex; flex-wrap:wrap; gap:.4rem; margin:0 0 1rem; padding:0; list-style:none;
    font-size:.875rem; color:#71717a; }
.bt-crumb a{ color:#145DA1; text-decoration:none; }
.bt-crumb a:hover{ text-decoration:underline; text-underline-offset:3px; }
.bt-crumb li + li::before{ content:"/"; margin-right:.4rem; color:#a1a1aa; }
/* Plan page intro: title block on the left, the plan panel on the right. */
.bt-hero-tier{ padding-bottom:2.5rem; }
.bt-tier-intro{ display:grid; gap:1.75rem; }
@media (min-width:900px){ .bt-tier-intro{ grid-template-columns:minmax(0, 1fr) 23rem; gap:3rem; align-items:center; } }
.bt-h1-tier{ font-size:clamp(2.1rem, 4vw, 2.75rem); margin-bottom:.75rem; }
.bt-hero-tier .bt-lede{ margin-bottom:1.5rem; }

.bt-switch{ display:flex; flex-wrap:wrap; gap:.5rem; }
.bt-switch-link{ --bt-dot:#059669; display:inline-flex; align-items:center; gap:.45rem; padding:.45rem .8rem;
    border:1px solid #e4e4e7; border-radius:999px; background:#fff; font-size:.875rem; font-weight:500;
    color:#3f3f46; text-decoration:none; transition:border-color .15s ease; }
.bt-switch-link:hover{ border-color:#a1a1aa; }
.bt-switch-alpha{ --bt-dot:#7c3aed; }
.bt-switch-enterprise{ --bt-dot:#72CDEC; }
.bt-switch-link .bt-dot{ width:8px; height:8px; }
.bt-switch-count{ color:#71717a; font-variant-numeric:tabular-nums; }
.bt-switch-link[aria-current="page"]{ font-weight:600; color:#18181b; border-color:#18181b; }
.bt-switch-alpha[aria-current="page"]{ background:#f7f5ff; border-color:#7c3aed; }
.bt-switch-enterprise[aria-current="page"]{ background:#0c2a4d; border-color:#0c2a4d; color:#fff; }
.bt-switch-enterprise[aria-current="page"] .bt-switch-count{ color:#8ea7c4; }
.bt-switch-free[aria-current="page"]{ background:#ecfdf5; border-color:#059669; }

.bt-plan{ --bt-head:#18181b; --bt-text:#3f3f46; --bt-check:#059669;
    padding:1.4rem 1.5rem 1.5rem; border-radius:14px; background:#fff; border:1px solid #e4e4e7; }
.bt-plan-alpha{ --bt-check:#7c3aed; background:#f7f5ff; border-color:#e4dcfb; }
.bt-plan-enterprise{ --bt-head:#fff; --bt-text:#c3d3e6; --bt-check:#72CDEC; --bt-cta-bg:#72CDEC; --bt-cta-text:#0c2a4d;
    --bt-cta-hover:#a3e0f4; background:#0c2a4d; border-color:#0c2a4d; -webkit-font-smoothing:antialiased; }
.bt-plan-title{ margin:0; font-family:'Inter Tight', Inter, system-ui, sans-serif; font-size:1.125rem; font-weight:700;
    letter-spacing:-.015em; color:var(--bt-head); }
.bt-plan-list{ list-style:none; margin:.85rem 0 0; padding:0; display:grid; gap:.55rem; }
.bt-plan-list li{ display:flex; gap:.55rem; font-size:.9rem; line-height:1.45; color:var(--bt-text); }
.bt-plan-list svg{ flex-shrink:0; margin-top:.1rem; color:var(--bt-check); }
.bt-plan .bt-cta{ margin-top:1.15rem; }

/* Tier bands: each sets its colours as variables, the shared rules read them. */
.bt-band, .bt-tier-free, .bt-tier-alpha, .bt-tier-enterprise{
    --bt-dot:#059669; --bt-head:#18181b; --bt-text:#52525b; --bt-meta:#71717a; --bt-rule:#e4e4e7;
    --bt-link:#145DA1; --bt-accent:#047857; --bt-cta-bg:#18181b; --bt-cta-text:#fff; --bt-cta-hover:#3f3f46;
}
.bt-band{ padding:3.5rem 0 3rem; scroll-margin-top:5rem; border-top:1px solid var(--bt-rule); }
.bt-band-alpha, .bt-tier-alpha{ --bt-dot:#7c3aed; --bt-rule:#e4dcfb; --bt-link:#6d28d9; --bt-accent:#6d28d9;
    --bt-cta-bg:#7c3aed; --bt-cta-hover:#6d28d9; }
.bt-band-alpha{ background:#f7f5ff; }
.bt-band-enterprise, .bt-tier-enterprise{ --bt-dot:#72CDEC; --bt-cta-bg:#0c2a4d; --bt-cta-text:#fff; --bt-cta-hover:#123761; }
.bt-band-enterprise{ --bt-head:#fff; --bt-text:#c3d3e6; --bt-meta:#8ea7c4; --bt-rule:#1d4069;
    --bt-link:#72CDEC; --bt-accent:#72CDEC; --bt-cta-bg:#72CDEC; --bt-cta-text:#0c2a4d; --bt-cta-hover:#a3e0f4;
    background:#0c2a4d; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }

.bt-band-grid{ display:grid; gap:1.75rem; }
@media (min-width:900px){
    .bt-band-grid{ grid-template-columns:15rem minmax(0, 1fr); gap:3.5rem; }
    .bt-band-head{ position:sticky; top:7.5rem; align-self:start; }
}
.bt-band-name{ display:flex; align-items:center; gap:.55rem; margin:0;
    font-family:'Inter Tight', Inter, system-ui, sans-serif; font-size:1.5rem; font-weight:700;
    letter-spacing:-.025em; color:var(--bt-head); }
.bt-dot{ width:9px; height:9px; border-radius:999px; background:var(--bt-dot); flex-shrink:0; }
.bt-band-note{ margin:.5rem 0 0; font-size:.9375rem; line-height:1.55; color:var(--bt-text); }
.bt-band-count{ margin:.35rem 0 0; font-size:.8125rem; color:var(--bt-meta); font-variant-numeric:tabular-nums; }
.bt-cta{ display:inline-block; margin-top:1.25rem; padding:.6rem 1rem; border-radius:8px;
    font-size:.875rem; font-weight:600; text-decoration:none;
    background:var(--bt-cta-bg); color:var(--bt-cta-text); transition:background-color .15s ease; }
.bt-cta:hover{ background:var(--bt-cta-hover); }

/* Studies: on the overview the newest leads at a larger size; the rest sit in two columns. */
.bt-meta{ display:flex; align-items:center; gap:.4rem; margin:0;
    font-size:.75rem; color:var(--bt-meta); font-variant-numeric:tabular-nums; }
.bt-latest{ font-weight:600; color:var(--bt-accent); }
.bt-lead a{ display:block; padding:0 0 2rem; text-decoration:none; }
.bt-lead-title{ margin:.5rem 0 0; max-width:46rem; font-family:'Inter Tight', Inter, system-ui, sans-serif;
    font-size:clamp(1.35rem, 2.2vw, 1.7rem); font-weight:700; line-height:1.22; letter-spacing:-.022em;
    color:var(--bt-head); transition:color .15s ease; }
.bt-lead-summary{ margin:.65rem 0 0; max-width:44rem; font-size:1rem; line-height:1.65; color:var(--bt-text); }

.bt-grid{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:minmax(0, 1fr); }
@media (min-width:1024px){ .bt-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); column-gap:2.5rem; } }
.bt-item{ border-top:1px solid var(--bt-rule); }
.bt-item a{ display:block; height:100%; padding:1.15rem 0 1.35rem; text-decoration:none; }
.bt-title{ margin:.4rem 0 0; font-family:'Inter Tight', Inter, system-ui, sans-serif;
    font-size:1.0625rem; font-weight:600; line-height:1.32; letter-spacing:-.012em; color:var(--bt-head);
    transition:color .15s ease; }
.bt-summary{ margin:.4rem 0 0; font-size:.875rem; line-height:1.6; color:var(--bt-text);
    display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.bt-lead a:hover .bt-lead-title, .bt-item a:hover .bt-title{ color:var(--bt-link); }
.bt-empty{ margin:0; font-size:.9375rem; color:var(--bt-text); }
.bt-sr{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* Overview: link from a band to its plan's own page. */
.bt-all{ display:inline-flex; align-items:center; gap:.4rem; margin-top:1.25rem; padding:.55rem .9rem;
    border:1px solid var(--bt-rule); border-radius:8px; font-size:.875rem; font-weight:600;
    color:var(--bt-head); text-decoration:none; transition:border-color .15s ease; }
.bt-all:hover{ border-color:var(--bt-link); }
.bt-all-count{ font-weight:500; color:var(--bt-meta); font-variant-numeric:tabular-nums; }

/* Plan page: the list runs full width; pages link newer and older. */
/* The band's edge starts the list, so the first row drops its own top rule. */
.bt-band-solo{ padding-top:1.5rem; }
.bt-band-solo .bt-grid > .bt-item:first-child{ border-top:0; }
@media (min-width:1024px){ .bt-band-solo .bt-grid > .bt-item:nth-child(2){ border-top:0; } }
/* Three columns keep "Page x of y" centred when only one of the two links is shown. */
.bt-pager{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:1rem;
    margin-top:2rem; padding-top:1.5rem; border-top:1px solid var(--bt-rule); font-size:.875rem; color:var(--bt-meta); }
.bt-pager > :first-child{ justify-self:start; }
.bt-pager > :last-child{ justify-self:end; }
.bt-pager a{ padding:.55rem .9rem; border:1px solid var(--bt-rule); border-radius:8px; font-weight:600;
    color:var(--bt-head); text-decoration:none; transition:border-color .15s ease; }
.bt-pager a:hover{ border-color:var(--bt-link); }
.bt-pager-spacer{ min-width:1px; }

/* Closing band: the data behind the studies, before the dark footer. */
.bt-run{ padding:3.5rem 0; background:#fafafa; border-top:1px solid #e4e4e7; }
.bt-run-grid{ display:grid; gap:1.5rem; align-items:center; }
@media (min-width:900px){ .bt-run-grid{ grid-template-columns:minmax(0, 1fr) auto; gap:3rem; } }
.bt-run-title{ margin:0; font-family:'Inter Tight', Inter, system-ui, sans-serif; font-size:1.6rem; font-weight:700;
    letter-spacing:-.025em; color:#18181b; }
.bt-run-text{ margin:.5rem 0 0; max-width:38rem; font-size:1rem; line-height:1.6; color:#52525b; }
.bt-run-actions{ display:flex; flex-wrap:wrap; gap:.6rem; }
.bt-btn{ display:inline-block; padding:.7rem 1.1rem; border-radius:8px; font-size:.9rem; font-weight:600;
    text-decoration:none; transition:background-color .15s ease, border-color .15s ease; }
.bt-btn-dark{ background:#18181b; color:#fff; }
.bt-btn-dark:hover{ background:#3f3f46; }
.bt-btn-line{ background:#fff; color:#18181b; border:1px solid #d4d4d8; }
.bt-btn-line:hover{ border-color:#71717a; }

.bt-lead a:focus-visible, .bt-item a:focus-visible, .bt-cta:focus-visible, .bt-btn:focus-visible,
.bt-all:focus-visible, .bt-pager a:focus-visible, .bt-crumb a:focus-visible{
    outline:2px solid var(--bt-dot, #145DA1); outline-offset:3px; border-radius:6px; }
@media (prefers-reduced-motion:reduce){
    .bt-cta, .bt-btn, .bt-title, .bt-lead-title, .bt-all, .bt-pager a{ transition:none; }
}