/* Horse-Oracle — Video Analysis page (page-video-analysis.hbs). v1, 2026-10-02.
   Uses the theme's tokens; fallbacks are the v4.2 Site values. Namespace: va-. */

@font-face{font-family:"Libre Caslon Text";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/libre-caslon-text-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Libre Caslon Text";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/libre-caslon-text-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Libre Caslon Text";font-style:italic;font-weight:400;font-display:swap;src:url("../fonts/libre-caslon-text-latin-400-italic.woff2") format("woff2")}
@font-face{font-family:"Archivo";font-style:normal;font-weight:100 900;font-stretch:62% 125%;font-display:swap;src:url("../fonts/archivo-latin-wdth-normal.woff2") format("woff2-variations")}

.va{--va-max:1180px;--night:#101e16;--paper:#f5f1e7;--paper-2:#fefaf2;--gold:#c3a45a;--gold-2:#e4ce92;--ink:#14201b;--ink-2:#44524a;--ink-3:#5c6862;--rule:#cbbd98;--on-night:#f5f1e7;--on-night-dim:#b9c4bc;--display:"Libre Caslon Text",Georgia,serif;--copy:"Libre Caslon Text",Georgia,serif;--fig:"Archivo","Arial Narrow",sans-serif;--fig-w:78%;--fig-wide:92%;color:var(--ink);font-family:var(--copy);}
.va-wrap{max-width:var(--va-max);margin-inline:auto;padding-inline:clamp(20px,4vw,40px)}
.va :where(h1,h2,h3){font-family:var(--display);font-weight:700;color:var(--ink,#14201b);margin:0;letter-spacing:-.005em}
.va p{margin:0}
.va-label{font-family:var(--fig);font-stretch:var(--fig-wide,92%);font-weight:600;font-size:14px;line-height:1.3;color:var(--ink-3,#5c6862)}

/* ---- 1. Hero: the photograph is the page's bold element ---- */
.va-hero{position:relative;min-height:clamp(240px,30vh,320px);display:flex;align-items:flex-end;background:var(--night,#101e16);overflow:hidden}
.va-hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--va-focus,60% 40%)}
.va-hero__panel{position:relative;margin-block:0 clamp(28px,5vw,56px);max-width:560px;background:color-mix(in srgb,var(--night,#101e16) 92%,transparent);border-left:3px solid var(--gold,#c3a45a);padding:26px 30px 28px}
.va-hero h1{color:var(--on-night,#f5f1e7);font-size:clamp(38px,4.3vw,60px);line-height:1.04}
.va-hero__dek{margin-top:14px;color:var(--on-night,#f5f1e7);font-size:19px;line-height:1.5;max-width:30em}

/* ---- 2. The replay stage (page body, edited in Ghost) ---- */
.va-stage{padding-block:clamp(40px,6vw,72px) clamp(36px,5vw,64px)}
.va-stage .va-replay{display:grid;grid-template-columns:minmax(0,2fr) minmax(260px,1fr);gap:clamp(24px,3vw,40px);align-items:start}
.va-frame{background:var(--night,#101e16);padding:10px;border-radius:2px}
.va-frame__ratio{position:relative;aspect-ratio:16/9;background:#0b1510}
.va-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.va-note h2{font-size:28px;line-height:1.15;margin-top:6px}
.va-note__text{margin-top:12px;font-size:17px;line-height:1.6;color:var(--ink-2,#44524a)}
.va-facts{margin:20px 0 0;padding:0;border-top:1px solid var(--rule,#cbbd98)}
.va-facts div{display:grid;grid-template-columns:5.5em 1fr;gap:14px;padding:10px 0;border-bottom:1px solid var(--rule,#cbbd98)}
.va-facts dt{font-family:var(--fig);font-stretch:var(--fig-wide,92%);font-weight:600;font-size:14px;color:var(--ink-3,#5c6862);padding-top:2px}
.va-facts dd{margin:0;font-size:16px;line-height:1.45}
.va-facts .va-fig{font-family:var(--fig);font-stretch:var(--fig-w,78%);font-weight:600;font-size:17px;font-variant-numeric:tabular-nums}
.va-button{display:inline-block;margin-top:22px;font-family:var(--fig);font-stretch:var(--fig-wide,92%);font-weight:650;font-size:16px;color:var(--night,#101e16);background:var(--gold,#c3a45a);padding:12px 18px;border-radius:2px;text-decoration:none}
.va-button:hover{background:var(--gold-2,#e4ce92)}
.va-small{margin-top:10px;font-size:14px;line-height:1.5;color:var(--ink-3,#5c6862)}

/* ---- 3. Where we look: the race rail (night band) ---- */
.va-rail{background:var(--night,#101e16);color:var(--on-night,#f5f1e7);padding-block:clamp(48px,6vw,80px)}
.va-rail h2{color:var(--on-night,#f5f1e7);font-size:clamp(30px,3vw,40px);line-height:1.1}
.va-rail__intro{margin-top:12px;max-width:36em;font-size:18px;line-height:1.6;color:var(--on-night-dim,#b9c4bc)}
.va-track{list-style:none;margin:44px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));position:relative}
/* the inside rail: one line the full width, posts at each call */
.va-track::before{content:"";position:absolute;left:0;right:0;top:46px;height:3px;background:var(--on-night,#f5f1e7);opacity:.9}
.va-call{position:relative;padding:0 18px 0 0}
.va-call__name{font-family:var(--display);font-weight:700;font-size:22px;line-height:1.1;height:36px}
.va-post{display:block;width:8px;height:30px;margin:0 0 22px;position:relative;top:-2px;
  background:repeating-linear-gradient(180deg,var(--on-night,#f5f1e7) 0 5px,var(--night,#101e16) 5px 9px);outline:1px solid var(--on-night,#f5f1e7)}
.va-call:last-child .va-post{background:var(--gold,#c3a45a);outline-color:var(--gold,#c3a45a);width:8px}
.va-call dl{margin:0}
.va-call dt{font-family:var(--fig);font-stretch:var(--fig-wide,92%);font-weight:600;font-size:14px;color:var(--gold-2,#e4ce92)}
.va-call dd{margin:4px 0 16px;font-size:16px;line-height:1.5}
.va-call dd.va-chart{color:var(--on-night-dim,#b9c4bc)}
.va-rail__foot{margin-top:28px;font-size:15px;line-height:1.55;color:var(--on-night-dim,#b9c4bc);max-width:44em}

/* ---- 4. What every analysis keeps apart: the tag ledger ---- */
.va-ledger{padding-block:clamp(48px,6vw,80px)}
.va-ledger__head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,64px);align-items:end}
.va-ledger h2{font-size:clamp(30px,3vw,40px);line-height:1.1}
.va-ledger__intro{font-size:18px;line-height:1.6;color:var(--ink-2,#44524a);max-width:34em}
.va-rows{list-style:none;margin:36px 0 0;padding:0;border-top:2px solid var(--ink,#14201b)}
.va-row{display:grid;grid-template-columns:11em minmax(0,4fr) minmax(0,7fr);gap:clamp(16px,3vw,40px);align-items:baseline;padding:22px 0;border-bottom:1px solid var(--rule,#cbbd98)}
.va-row h3{font-size:23px;line-height:1.2}
.va-row p{font-size:17px;line-height:1.6;color:var(--ink-2,#44524a)}

/* Evidence tags. The theme's v4 tag styles win where they exist; these match by class. */
.va .tag{display:inline-block;font-family:var(--fig);font-stretch:var(--fig-wide,92%);font-weight:650;font-size:14px;line-height:1;padding:6px 10px;border-radius:999px;white-space:nowrap}
.va .tag-verified{background:var(--night,#101e16);color:var(--on-night,#f5f1e7)}
.va .tag-video{background:var(--gold-2,#e4ce92);color:var(--ink,#14201b);border:1px solid var(--gold,#c3a45a)}
.va .tag-inferred{border:1px dashed var(--ink-3,#5c6862);color:var(--ink-2,#44524a);font-style:italic}
.va .tag-unknown{border:1px dotted var(--ink-2,#44524a);color:var(--ink-2,#44524a)}

/* ---- 5. Published analyses (shown only when posts carry #video) ---- */
.va-list{background:var(--paper-2,#fefaf2);padding-block:clamp(48px,6vw,80px);border-top:1px solid var(--rule,#cbbd98)}
.va-list h2{font-size:clamp(30px,3vw,40px);line-height:1.1}
.va-cards{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,36px)}
.va-card a{color:inherit;text-decoration:none}
.va-card img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;background:var(--night,#101e16)}
.va-card time{display:block;margin-top:14px;font-family:var(--fig);font-stretch:var(--fig-w,78%);font-weight:600;font-size:15px;color:var(--ink-3,#5c6862);font-variant-numeric:tabular-nums}
.va-card h3{margin-top:6px;font-size:22px;line-height:1.2}
.va-card a:hover h3{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}

.va a:focus-visible,.va-button:focus-visible{outline:3px solid var(--gold,#c3a45a);outline-offset:3px}
.va-rail a:focus-visible{outline-color:var(--gold-2,#e4ce92)}

/* ---- Phone ---- */
@media (max-width:899px){
  .va-stage .va-replay,.va-ledger__head{grid-template-columns:1fr}
  .va-cards{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .va-hero{min-height:260px}
  .va-hero__panel{margin-inline:0;padding:22px 22px 24px}
  .va-hero__dek{font-size:17px}
  .va-frame{padding:6px;margin-inline:calc(-1 * clamp(20px,4vw,40px))}
  /* the rail turns vertical: runs down the left, calls stack */
  .va-track{grid-template-columns:1fr;margin-top:32px;padding-left:34px}
  .va-track::before{left:9px;right:auto;top:6px;bottom:6px;width:3px;height:auto}
  .va-call{padding:0 0 10px}
  .va-call__name{height:auto;margin-bottom:10px}
  .va-post{position:absolute;left:-34px;top:2px;width:22px;height:8px;margin:0;
    background:repeating-linear-gradient(90deg,var(--on-night,#f5f1e7) 0 5px,var(--night,#101e16) 5px 9px)}
  .va-call:last-child .va-post{width:22px}
  .va-row{grid-template-columns:1fr;gap:10px}
  .va-cards{grid-template-columns:1fr}
}
@media print{
  .va-hero{min-height:0;background:none}.va-hero__img{display:none}
  .va-hero__panel{background:none;color:var(--ink)}.va-hero h1,.va-hero__dek{color:var(--ink)}
  .va-rail{background:none;color:var(--ink)}.va-rail h2{color:var(--ink)}
  .va-frame iframe{display:none}
}