/* Space Vanta Theme 1.0 | Journal shared look | JOURNAL-001
   DNA in three places only, so the pages stay easy to read:
   - layers / floating: a card sits on a second, offset plate (.sv-jr-plate), lifts a few px on hover
   - linear geometry: hairlines, a short blue stub, numbered rows, one cut corner
   - fracture: two silver shards in the hero zones and one slice across a lead image. Never inside the article text.
   Colours come from sv-ui/vanta-tokens.css (warm paper base, ink, one blue). Blue is for lines; text and buttons use blue-ink (AA). */
.sv-hj, .sv-jh, .sv-jra {
  --jr-ink: var(--sv-ink, #1B2026); --jr-mute: var(--sv-ink-2, #5A636E); --jr-line: var(--sv-line, rgba(27,32,38,.14));
  --jr-paper: var(--sv-base, #FAF7F2); --jr-surface: var(--sv-surface, #fff);
  --jr-blue: var(--sv-blue, #2F6BFF); --jr-blue-ink: var(--sv-blue-ink, #1F55D6);
  --jr-s1: var(--sv-silver-1, #E9ECEF); --jr-s2: var(--sv-silver-2, #B9C0C8);
  --jr-cut: var(--sv-cut, 14px); --jr-ease: cubic-bezier(.2,.8,.2,1);
  --jr-lift: 0 22px 40px -26px rgba(27,32,38,.55), 0 2px 8px -3px rgba(27,32,38,.14);
  --jr-gutter: max(16px, 3vw);
  position: relative; color: var(--jr-ink); font-family: var(--sv-font-body, "Inter", system-ui, sans-serif);
  -webkit-text-size-adjust: 100%;
}
.sv-hj *, .sv-jh *, .sv-jra * { box-sizing: border-box; }
:where(.sv-hj, .sv-jh, .sv-jra) a { color: inherit; }   /* :where keeps this at zero weight so buttons and chips keep their own colours */
.sv-hj :focus-visible, .sv-jh :focus-visible, .sv-jra :focus-visible { outline: 2px solid var(--jr-blue); outline-offset: 3px; }

/* eyebrow: short blue stub + small caps label */
.sv-jr-eyebrow { display: flex; align-items: center; gap: .6rem; margin: 0; font: 600 .74rem/1 var(--sv-font-display, sans-serif); letter-spacing: .14em; text-transform: uppercase; color: var(--jr-blue-ink); }
.sv-jr-eyebrow i { display: block; width: 1.6rem; height: 2px; background: var(--jr-blue); }
.sv-jr-rule { display: inline-block; vertical-align: middle; width: 2.2rem; height: 2px; margin-right: .7rem; background: var(--jr-blue); }

/* silver shard (fracture) */
.sv-jr-shard { position: absolute; display: block; pointer-events: none; background: linear-gradient(135deg, #fff, var(--jr-s2)); opacity: .6; }

/* buttons and chips (44px touch height) */
.sv-jr-btn { display: inline-flex; align-items: center; justify-content: center; gap: .6rem; min-height: 44px; padding: .6rem 1.2rem; font: 600 .9rem/1.1 var(--sv-font-body, sans-serif); text-decoration: none; cursor: pointer;
  color: #fff; background: var(--jr-ink); border: 1px solid var(--jr-ink); transition: background .3s var(--jr-ease), color .3s var(--jr-ease), transform .3s var(--jr-ease); }
.sv-jr-btn:hover { background: var(--jr-blue-ink); border-color: var(--jr-blue-ink); }
.sv-jr-btn:disabled { opacity: .6; cursor: default; }
.sv-jr-btn--ghost { color: var(--jr-ink); background: transparent; border-color: var(--jr-ink); }
.sv-jr-btn--ghost:hover { color: #fff; }
.sv-jr-btn span { transition: transform .3s var(--jr-ease); }
.sv-jr-btn:hover span { transform: translateX(3px); }
.sv-jr-chip { display: inline-flex; align-items: center; flex: none; min-height: 44px; padding: .5rem 1rem; font: 500 .9rem var(--sv-font-body, sans-serif); text-decoration: none; color: var(--jr-mute);
  background: rgba(255,255,255,.6); border: 1px solid var(--jr-line); transition: color .3s var(--jr-ease), background .3s var(--jr-ease); }
.sv-jr-chip:hover { color: var(--jr-ink); background: var(--jr-surface); }
.sv-jr-chip[aria-current="page"] { color: #fff; background: var(--jr-ink); border-color: var(--jr-ink); }

/* layered card: offset second plate behind the first */
.sv-jr-plate { position: relative; isolation: isolate; }
.sv-jr-plate::before { content: ""; position: absolute; inset: 0; z-index: -1; transform: translate(9px, 9px); background: linear-gradient(135deg, var(--jr-s1), var(--jr-s2)); border: 1px solid var(--jr-line); opacity: .75; transition: transform .45s var(--jr-ease); }
.sv-jr-plate:hover::before, .sv-jr-plate:focus-within::before { transform: translate(13px, 13px); }

@media (prefers-reduced-motion: reduce) {
  .sv-hj *, .sv-jh *, .sv-jra *, .sv-hj *::before, .sv-jh *::before, .sv-jra *::before { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}