/* chariot.css · Vectorlane · VII, The Chariot · "Kinetic dispatch"
   Extends arcana.css: overrides its --arc-* tokens on [data-brand="the-chariot"], adds the --brand-*
   extras arcana-brand.css reads, then the signature: asphalt with a yellow centre lane, a condensed
   italic headline that is dispatched in from the kerb, a head that steps down and right like stops
   on a route, and a cyan route that draws itself once and lands on a yellow drop-off pin. */
/* fonts:begin Saira */
@font-face { font-family:"Saira"; font-style:italic; font-weight:400 900; font-stretch:50% 125%; font-display:swap; src:url("../../fonts/brands/saira-italic-400-900.woff2") format("woff2"); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:"Saira"; font-style:normal; font-weight:400 900; font-stretch:50% 125%; font-display:swap; src:url("../../fonts/brands/saira-normal-400-900.woff2") format("woff2"); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
/* fonts:end */

[data-brand="the-chariot"] {
  --arc-paper: #101214;
  --arc-surface: #181b1f;
  --arc-wash: #0b0d0f;
  --arc-ink: #edf0f1;
  --arc-muted: #a3acb5;
  --arc-line: #2e343b;
  --arc-accent: #ffdd00;
  --arc-on-accent: #121314;
  --arc-focus: #22d3e6;
  --arc-display: "Saira", "Bahnschrift", "DIN Condensed", "Arial Narrow", sans-serif;
  --arc-body: "Saira", "Bahnschrift", "Segoe UI", system-ui, sans-serif;
  --arc-radius: 0;
  --brand-mono: "Saira", "Bahnschrift", "Segoe UI", system-ui, sans-serif;
  --brand-accent-2: #22d3e6;
  --brand-display-weight: 800;
  --brand-display-style: italic;
  --brand-track: -.01em;
  --brand-case: uppercase;
  --brand-title-size: clamp(3.4rem, 1rem + 9.5vw, 10.5rem);
  --brand-title-lh: .86;
  --brand-button-radius: 0;
  --brand-enter: vl-dispatch;
  --brand-ease: cubic-bezier(.2, .7, .15, 1);
  --brand-texture:
    radial-gradient(circle at 30% 40%, rgba(237, 240, 241, .035) 0 1px, transparent 1.5px) 0 0 / 5px 5px,
    radial-gradient(circle at 70% 70%, rgba(0, 0, 0, .35) 0 1px, transparent 1.5px) 0 0 / 9px 9px;
  --brand-bezel: #0b0d0f;
  --brand-bezel-edge: #2e343b;
  --brand-bezel-ink: #ffdd00;
  --brand-glow: rgba(255, 221, 0, .38);
  --brand-wallpaper:
    linear-gradient(90deg, #ffdd00 0 50%, transparent 0) 0 50% / 64px 6px repeat-x,
    linear-gradient(transparent calc(50% - 46px), rgba(237, 240, 241, .08) calc(50% - 46px) calc(50% - 44px), transparent 0 calc(50% + 44px), rgba(237, 240, 241, .08) 0 calc(50% + 46px), transparent 0),
    repeating-linear-gradient(30deg, transparent 0 70px, rgba(34, 211, 230, .13) 70px 72px),
    repeating-linear-gradient(-30deg, transparent 0 70px, rgba(237, 240, 241, .05) 70px 72px),
    #101214;
}

/* Signature: stepped head, condensed italic lettering, a route that draws once to a drop-off pin. */
[data-brand="the-chariot"] .abr-title,
[data-brand="the-chariot"] .abr-heading,
[data-brand="the-chariot"] .abr-type__aa { font-stretch: 62.5%; }
[data-brand="the-chariot"] .abr-tagline { padding-inline-start: clamp(1rem, 5vw, 4rem); font-stretch: 75%; font-weight: 700; }
[data-brand="the-chariot"] .abr-head__row { padding-inline-start: clamp(2rem, 10vw, 8rem); }
[data-brand="the-chariot"] .abr-card__num { background: var(--arc-accent); color: var(--arc-on-accent); border-color: var(--arc-accent); font-style: italic; }
[data-brand="the-chariot"] .abr-head::after {
  content: ""; position: absolute; inset: auto 12% 0 0; block-size: 4px;
  background: repeating-linear-gradient(90deg, #22d3e6 0 18px, transparent 18px 28px);
  animation: vl-route 1.3s .45s var(--brand-ease) both;
}
[data-brand="the-chariot"] .abr-head::before {
  content: ""; position: absolute; inset-block-end: -6px; inset-inline-end: calc(12% - 8px);
  inline-size: 16px; block-size: 16px; border-radius: 50%;
  background: #ffdd00; box-shadow: 0 0 0 4px #101214, 0 0 0 5px #ffdd00;
  animation: vl-pin .4s 1.7s cubic-bezier(.3, 1.6, .5, 1) both;
}
[data-brand="the-chariot"] .abr-button { font-style: italic; font-weight: 800; font-stretch: 75%; text-transform: uppercase; letter-spacing: .04em; font-size: 1.05rem; }
[data-brand="the-chariot"] .abr-button::after { content: "\2192"; font-style: normal; transition: transform .25s var(--brand-ease); }
[data-brand="the-chariot"] .abr-button[data-kind="ghost"] { border-color: var(--arc-accent); }
@media (hover: hover) {
  [data-brand="the-chariot"] .abr-button:hover { transform: translateX(3px); box-shadow: -6px 0 0 #22d3e6; }
  [data-brand="the-chariot"] .abr-button:hover::after { transform: translateX(5px); }
}
[data-brand="the-chariot"] .abr-offer { clip-path: polygon(0 clamp(1.5rem, 4vw, 3rem), 100% 0, 100% 100%, 0 100%); padding-block-start: clamp(5rem, 10vw, 8rem); }
[data-brand="the-chariot"] .abr-tier { border-inline-start: 6px solid var(--arc-accent); background: #14171a; }
[data-brand="the-chariot"] .abr-tier[data-kind="custom"] { border-inline-start-color: #22d3e6; }
[data-brand="the-chariot"].abr-tile .abr-tile__word { font-stretch: 68%; font-size: min(2.8rem, 13cqi); line-height: .9; }
@media (hover: hover) {
  [data-brand="the-chariot"].abr-tile:hover { transform: translateX(6px) translateY(-3px); box-shadow: 0 0 0 1px var(--arc-accent), -8px 0 0 #22d3e6; }
}

@keyframes vl-dispatch { 0% { opacity: 0; transform: translateX(-48px) skewX(-10deg); } 70% { opacity: 1; transform: translateX(4px) skewX(1deg); } 100% { opacity: 1; transform: none; } }
@keyframes vl-route { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
@keyframes vl-pin { from { opacity: 0; transform: scale(0); } to { opacity: 1; transform: none; } }