/* Overrides for the MODX pilot. The archive styles supply the 3+ visual system. */
.okv3 {
  --okv3-story-height: max(35rem, calc(100svh - 5rem));
  --okv3-header: 5rem;
  --okv3-control: 2.75rem;
  --okv3-logo: 8rem;
  --okv3-logo-small: 5.5rem;
  --okv3-cover: 34rem;
  --okv3-slogan: .68rem;
}
.okv3 [hidden] { display: none !important; }
.okv3 .ok-lockup { display: inline-flex; flex-direction: column; align-items: center; gap: var(--space-1); width: var(--okv3-logo); flex: none; color: inherit; text-decoration: none; }
.okv3 .ok-lockup img { display: block; width: 100%; height: auto; }
.okv3 .ok-slogan { font: 500 var(--okv3-slogan)/1.15 var(--ok-font); white-space: nowrap; }
.okv3 .okx-ft { color: var(--white); }
.okv3 .okx-ft a.ok-lockup { color: var(--white); }
.okv3 :focus-visible { outline: 2px solid currentColor; outline-offset: var(--space-1); }
.okv3 .ok-skip:focus { z-index: 150; }
.okv3 .okx-mega[inert], .okv3 .okx-mm[inert] { visibility: hidden; }
.okv3 .okp-cover img { aspect-ratio: 2.4; width: 100%; height: auto; max-block-size: var(--okv3-cover); object-fit: cover; transform: none; }
.okv3 .okp-pass-row dd { min-inline-size: 0; overflow-wrap: anywhere; }
.okv3 .okp-words .is-mk, .okv3 .okb-card-title .is-mk { display: inline; color: var(--black); background: var(--lime); padding-inline: .11em; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.okv3 .okp-w, .okv3 .okb-w, .okv3 .okp-fade, .okv3 .okp-chan li,
.okv3 .okx-r, .okv3 .okp-pass-row, .okv3 .okx-fc, .okv3 .okb-card-n, .okv3 .okb-card-text {
  opacity: 1; transform: none; filter: none;
}
.okv3 .okp-cover, .okv3 .okp-cover img, .okv3 .okx-fc-img { clip-path: none; }
.okv3 .okb-gl { visibility: hidden; }
.okv3 .okv3-story-poster { position: absolute; inset: 0; background: var(--white) url('../media/renders/lit.webp') center / contain no-repeat; }
.okv3 .okb-stage { position: relative; block-size: min(62vw, 32rem); }
.okv3 .okb-hud, .okv3 .okb-code { display: none; }
.okv3 .okb-ch { position: relative; min-block-size: 0; height: auto; scroll-margin-block-start: var(--okv3-header); }
.okv3 .okb-ch:not(.is-on) .okb-card, .okv3 .okb-card { opacity: 1; transform: none; }
.okv3 .okb-ch .okb-card-text { opacity: 1; }
.okv3 .okb-ch-in { min-block-size: 0; padding-block: var(--space-4); pointer-events: auto; }
.okv3 .okb-card { width: 100%; }
.okv3 .okv3-chapter:nth-of-type(even) .okb-card { background: var(--green); color: var(--white); }
.okv3 .okv3-chapter:nth-of-type(even) :is(.okb-card-label, .okb-card-text) { color: var(--white); }
.okv3 .okv3-chapter:nth-of-type(even) .okb-card-n { -webkit-text-stroke-color: var(--lime); }
.okv3 .okv3-chapter[data-chapter="5"] .okb-card { background: var(--lime); color: var(--black); }
.okv3 .okv3-chapter[data-chapter="5"] .okb-card-n { -webkit-text-stroke-color: var(--green); }
.okv3 .okv3-chapter[data-chapter="5"] :is(.okb-card-label, .okb-card-text) { color: var(--green); }
.okv3 .okv3-story-live .okb-track { overflow: clip; isolation: isolate; }
.okv3 .okv3-story-live .okb-stage { position: sticky; inset-block-start: var(--okv3-header); block-size: var(--okv3-story-height); }
/* Overlay the first chapter without shrinking the sticky stage's margin box. */
.okv3 .okv3-story-live .okb-stage + .okb-ch { margin-block-start: calc(-1 * var(--okv3-story-height)); }
.okv3 .okv3-story-live .okb-gl { visibility: visible; }
.okv3 .okv3-story-live .okv3-story-poster { display: none; }
.okv3 .okv3-story-live .okb-hud { display: flex; }
.okv3 .okv3-story-live .okb-code { display: block; }
.okv3 .okv3-story-live .okb-ch { min-block-size: var(--okv3-story-height); pointer-events: none; }
.okv3 .okv3-story-live .okb-ch-in { pointer-events: none; }
.okv3 .okv3-story-live .okb-card { width: min(42vw, 37rem); }
.okv3 .okv3-story-live .okb-ch:not(.is-on) .okb-card { opacity: .16; }
.okv3 .okv3-chapter-link { display: inline-flex; gap: var(--space-1); align-items: center; min-block-size: var(--okv3-control); color: var(--black); }
.okv3 .okv3-chapter-link[aria-current] { font-weight: 600; }
.okv3 .okv3-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); margin-block: var(--space-8); }
.okv3 .okv3-gallery-item { margin: 0; }
.okv3 .okv3-gallery-item[data-kind="website"] { grid-column: 1 / -1; }
.okv3 .okv3-gallery-item img { display: block; width: 100%; height: auto; }
.okv3 .okv3-gallery-item[data-kind="mobile"] img { max-block-size: var(--okv3-cover); object-fit: contain; background: var(--lime-100); }
.okv3 .okv3-gallery-item figcaption { margin-block-start: var(--space-2); color: var(--ink-muted); }
.okv3 .okv3-form { display: grid; align-content: start; gap: var(--space-4); }
.okv3 .okv3-form > button { justify-self: start; }
.okv3 .okv3-options { min-inline-size: 0; margin: 0; padding: 0; border: 0; }
.okv3 .okv3-options legend { margin-block-end: var(--space-2); }
.okv3 .okv3-options label:has(input[type="radio"]) { display: inline-block; position: relative; margin: var(--space-1); cursor: pointer; }
.okv3 .okv3-options input[type="radio"] { position: absolute; opacity: 0; inset-inline-start: 0; }
.okv3 .okv3-options input[type="radio"] + span { display: inline-flex; align-items: center; min-block-size: var(--okv3-control); padding-inline: var(--space-4); border: 1px solid currentColor; border-radius: var(--radius-pill); }
.okv3 .okv3-options input[type="radio"]:checked + span { background: var(--lime); color: var(--black); border-color: var(--lime); }
.okv3 .okv3-options input[type="radio"]:focus-visible + span { outline: 2px solid currentColor; outline-offset: var(--space-1); }
.okv3 .okv3-field { display: grid; gap: var(--space-1); margin-block: var(--space-2); }
.okv3 .okv3-field input { min-block-size: var(--okv3-control); inline-size: 100%; border: 0; border-block-end: 1px solid currentColor; background: transparent; color: inherit; font: inherit; }
.okv3 .okv3-consent { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); }
.okv3 .okv3-consent a { color: inherit; }
.okv3 .okv3-lead { position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: transparent; color: var(--black); }
.okv3 .okv3-lead[open] { visibility: visible; pointer-events: auto; }
.okv3 .okv3-lead[open] .okp-lead-panel { transform: none; }
.okv3 .okv3-lead::backdrop { background: rgb(18 73 68 / .5); }
.okv3 .okv3-step-meter { border-block-end: var(--space-1) solid var(--lime); padding-block-end: var(--space-2); margin-block: var(--space-4); }
.okv3 .okv3-lead-nav { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-block-start: var(--space-4); }
.okv3 .okv3-form-message { margin: 0; }
body:has(.okv3-lead[open]) { overflow: hidden; }
.okv3 .okp-cookies { max-block-size: 85svh; overflow-y: auto; }
.okv3 .okp-cookies [data-cookie-switch] { min-block-size: var(--space-6); }
@media (min-width: 761px) {
  .okv3 #story:not(.okv3-story-live) .okb-track { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .okv3 #story:not(.okv3-story-live) .okb-stage { grid-row: 1; grid-column: 2; block-size: var(--okv3-story-height); }
  .okv3 #story:not(.okv3-story-live) [data-chapter="1"] { grid-row: 1; grid-column: 1; }
  .okv3 #story:not(.okv3-story-live) [data-chapter="1"] .okb-ch-in { height: 100%; display: grid; align-items: center; }
}
@media (max-width: 760px) {
  .okv3 { --okv3-header: 4rem; }
  .okv3 .ok-lockup { width: var(--okv3-logo-small); }
  .okv3 .okv3-story-live .okb-card { width: 100%; }
  .okv3 .okv3-story-live .okb-code, .okv3 .okv3-story-live .okb-hud { display: none; }
  .okv3 .okv3-gallery { gap: var(--space-4); }
  .okv3 .okv3-lead .okp-lead-panel { border-radius: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .okv3 *, .okv3 *::before, .okv3 *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}