
  .logo[data-wald-b79c39a9]{
    width: 100%;
    max-width: var(--logo-width, none);
    height: auto;
  }


  .phone[data-wald-f037ef9b]{
    position: relative;
    width: 100%;
    margin: 0;
    padding: 0.6rem;
    border-radius: 2.6rem;
    background: #050407;
    transform: rotate(-3deg);
  }
  .phone[data-wald-f037ef9b]{
    box-shadow: 0 0 0 3px var(--ir-yellow), 14px 14px 0 var(--ir-red);
  }
  .screen[data-wald-f037ef9b]{
    position: relative;
    aspect-ratio: 9 / 18;
    overflow: hidden;
    border-radius: 2rem;
    background: #14111b;
  }

  /* Tilted map like a real navigation view */
  .map-wrap[data-wald-f037ef9b]{
    position: absolute;
    inset: 0;
    perspective: 520px;
    perspective-origin: 50% 30%;
  }
  .map[data-wald-f037ef9b]{
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    transform: rotateX(38deg) scale(1.35);
    transform-origin: 50% 72%;
  }
  .route-flow[data-wald-f037ef9b]{
    animation: flow 1.4s linear infinite;
  }
  @keyframes flow {
    to {
      stroke-dashoffset: -25;
    }
  }

  .maneuver[data-wald-f037ef9b]{
    position: absolute;
    inset: 0.75rem 0.75rem auto;
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3);
    border-radius: 0.75rem;
    background: var(--ir-gradient);
    color: var(--on-accent);
  }
  .maneuver svg[data-wald-f037ef9b]{
    flex: none;
    width: 2.25rem;
    height: 2.25rem;
  }
  .maneuver div[data-wald-f037ef9b]{
    display: grid;
    line-height: 1.2;
  }
  .maneuver strong[data-wald-f037ef9b]{
    font-size: 1.5rem;
    font-weight: 900;
    font-style: italic;
  }
  .maneuver span[data-wald-f037ef9b]{
    font-size: 0.8125rem;
    font-weight: 500;
  }
  .alert[data-wald-f037ef9b]{
    position: absolute;
    top: 6.25rem;
    left: 0.75rem;
    padding: 0.35rem 0.7rem;
    background: var(--on-accent);
    box-shadow: inset 0 0 0 2px var(--ir-red);
    color: var(--text);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }
  .hud[data-wald-f037ef9b]{
    position: absolute;
    inset: auto 0.75rem 0.75rem;
    display: grid;
    grid-template-columns: 1fr 1fr auto;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3);
    border-radius: 1rem;
    background: rgb(23 19 31 / 0.95);
    box-shadow: inset 0 0 0 1px var(--border);
  }
  .hud p[data-wald-f037ef9b]{
    display: grid;
    line-height: 1.1;
  }
  .hud strong[data-wald-f037ef9b]{
    font-size: 1.125rem;
    font-weight: 800;
  }
  .hud span[data-wald-f037ef9b]{
    color: var(--text-muted);
    font-size: 0.6875rem;
  }
  .speed[data-wald-f037ef9b]{
    place-items: center;
    align-content: center;
    gap: 1px;
    width: 3.75rem;
    height: 3.75rem;
    border-radius: 50%;
    box-shadow: inset 0 0 0 3px var(--ir-yellow);
    text-align: center;
  }
  .hud .speed span[data-wald-f037ef9b]{
    font-size: 0.5625rem;
  }


  .site-footer[data-wald-4ee12808]{
    margin-top: var(--space-16);
    padding-block: var(--space-8);
    border-top: 1px solid var(--border);
    color: var(--text-muted);
    font-size: var(--fs-sm);
  }
  .row[data-wald-4ee12808]{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: var(--space-2) var(--space-6);
  }


  .site-header[data-wald-7e19a411]{
    position: sticky;
    top: 0;
    z-index: 10;
    background: color-mix(in srgb, var(--bg) 82%, transparent);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--border);
  }
  .bar[data-wald-7e19a411]{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    min-height: 4.5rem;
  }
  .home[data-wald-7e19a411]{
    display: block;
    width: clamp(7.5rem, 30vw, 9.5rem);
  }


  /* ── Hero on a dark map grid ── */
  .hero[data-wald-28894e32]{
    padding-block: clamp(2.5rem, 7vw, 5rem) clamp(3rem, 8vw, 6rem);
    background:
      linear-gradient(rgb(255 255 255 / 0.03) 1px, transparent 1px) 0 0 / 48px 48px,
      linear-gradient(90deg, rgb(255 255 255 / 0.03) 1px, transparent 1px) 0 0 / 48px 48px,
      radial-gradient(60% 45% at 15% 115%, rgb(255 59 59 / 0.22), transparent 70%),
      var(--bg);
    overflow: hidden;
  }
  .hero-grid[data-wald-28894e32]{
    display: grid;
    grid-template-columns: 1fr;
    align-items: center;
    gap: var(--space-12);
  }
  @media (min-width: 960px) {
    .hero-grid[data-wald-28894e32]{
      grid-template-columns: 1.15fr 0.85fr;
    }
  }
  .hero-grid > *[data-wald-28894e32]{
    min-width: 0;
  }
  .copy[data-wald-28894e32]{
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    justify-items: start;
    gap: var(--space-6);
  }

  /* ── Brutalist type and controls ── */
  .tag[data-wald-28894e32]{
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-1) var(--space-3);
    background: var(--ir-gradient);
    color: var(--on-accent);
    font-size: var(--fs-sm);
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }
  /* Infra-red: a pulsing red live dot */
  .live[data-wald-28894e32]{
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    background: var(--ir-red);
    box-shadow: 0 0 0 0 rgb(255 59 59 / 0.6);
    animation: live 1.6s ease-out infinite;
  }
  @keyframes live {
    to {
      box-shadow: 0 0 0 0.5rem rgb(255 59 59 / 0);
    }
  }
  h1[data-wald-28894e32]{
    font-size: clamp(3.5rem, 1.8rem + 8vw, 8.5rem);
    font-weight: 900;
    line-height: 0.86;
    letter-spacing: -0.03em;
    text-transform: uppercase;
  }
  /* Logo treatment: gradient fill, white outline, white extrusion below */
  /* Wordmark treatment: one solid white shape (thick outline that runs a little further down)
     behind gradient-filled letters — the same construction as the logo */
  .logo-text[data-wald-28894e32]{
    position: relative;
    display: inline-block;
    padding-inline-end: 0.06em;
  }
  .logo-text[data-wald-28894e32]::before{
    content: attr(data-text);
    position: absolute;
    inset: 0;
    padding-inline-end: inherit;
    color: #fff;
    -webkit-text-stroke: 0.2em #fff;
    transform: translateY(0.045em);
  }
  .logo-text > span[data-wald-28894e32]{
    position: relative;
    /* Italic glyphs overhang their box; widen the painted area without moving the letters */
    padding-inline: 0.12em 0.25em;
    margin-inline: -0.12em -0.25em;
    color: transparent;
    background: var(--ir-gradient);
    -webkit-background-clip: text;
    background-clip: text;
  }
  .sub[data-wald-28894e32]{
    max-width: 32rem;
    color: var(--text-muted);
    font-size: var(--fs-lg);
  }
  .search[data-wald-28894e32]{
    display: flex;
    align-items: stretch;
    width: min(100%, 32rem);
    border: 3px solid;
    border-image: var(--ir-gradient) 1;
    background: var(--surface);
    color: var(--text-muted);
    text-decoration: none;
    box-shadow: 8px 8px 0 var(--ir-red);
    transition: transform 0.12s ease, box-shadow 0.12s ease;
  }
  .search[data-wald-28894e32]:hover{
    transform: translate(-2px, -2px);
    box-shadow: 10px 10px 0 var(--ir-gold);
  }
  .search[data-wald-28894e32]:active{
    transform: translate(6px, 6px);
    box-shadow: 2px 2px 0 var(--ir-red);
  }
  .search svg[data-wald-28894e32]{
    flex: none;
    align-self: center;
    width: 1.25rem;
    height: 1.25rem;
    margin-inline: var(--space-4) var(--space-3);
  }
  .placeholder[data-wald-28894e32]{
    flex: 1;
    min-width: 0;
    align-self: center;
    padding-block: var(--space-4);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .go[data-wald-28894e32]{
    flex: none;
    display: grid;
    place-items: center;
    padding: 0 var(--space-4);
    background: var(--ir-gradient);
    color: var(--on-accent);
    font-weight: 900;
    font-style: italic;
    text-transform: uppercase;
    white-space: nowrap;
  }

  /* ── Phone on a striped slab ── */
  .device[data-wald-28894e32]{
    position: relative;
    justify-self: center;
    width: min(100%, 20rem);
  }
  /* Infra-red heat glow behind the phone */
  .device[data-wald-28894e32]::before{
    content: '';
    position: absolute;
    inset: -22% -40%;
    background: radial-gradient(closest-side, rgb(255 59 59 / 0.5), rgb(255 59 59 / 0.12) 60%, transparent);
    filter: blur(24px);
    pointer-events: none;
  }
  .slab[data-wald-28894e32]{
    position: absolute;
    inset: 8% -14% -6% 18%;
    background:
      repeating-linear-gradient(-45deg, var(--on-accent) 0 16px, transparent 16px 32px),
      var(--ir-gradient);
    border: 3px solid;
    border-image: var(--ir-gradient) 1;
  }

  /* ── Hazard + matrix board ── */
  .hazard[data-wald-28894e32]{
    height: 1.25rem;
    background:
      repeating-linear-gradient(-45deg, var(--on-accent) 0 18px, transparent 18px 36px),
      var(--ir-gradient);
  }
  .matrix[data-wald-28894e32]{
    padding: var(--space-6) 0;
    background: #07060a;
    border-bottom: 3px solid var(--ir-red);
  }
  .board[data-wald-28894e32]{
    overflow: hidden;
    mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent);
  }
  .track[data-wald-28894e32]{
    display: flex;
    gap: var(--space-16);
    width: max-content;
    animation: ticker 32s linear infinite;
  }
  .track span[data-wald-28894e32]{
    color: var(--ir-gold);
    font-size: clamp(1rem, 0.8rem + 1vw, 1.5rem);
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    text-shadow: 0 0 12px rgb(255 175 25 / 0.55);
    white-space: nowrap;
  }
  .hot[data-wald-28894e32]{
    color: var(--ir-red);
    font-style: normal;
    text-shadow: 0 0 12px rgb(255 59 59 / 0.7);
  }
  @keyframes ticker {
    to {
      transform: translateX(-50%);
    }
  }

  /* ── Steps ── */
  .steps[data-wald-28894e32]{
    margin-top: var(--space-16);
  }
  .steps h2[data-wald-28894e32]{
    font-size: clamp(2.25rem, 1.4rem + 4vw, 4.5rem);
    font-weight: 900;
    text-transform: uppercase;
    line-height: 0.9;
    margin-bottom: var(--space-8);
  }
  .steps ol[data-wald-28894e32]{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
    gap: var(--space-6);
    padding: 0;
    list-style: none;
  }
  .steps li[data-wald-28894e32]{
    display: grid;
    gap: var(--space-3);
    align-content: start;
    padding: var(--space-6);
    background: var(--surface);
    border: 3px solid var(--text);
    box-shadow: 8px 8px 0 var(--ir-red);
    transition: transform 0.12s ease, box-shadow 0.12s ease;
  }
  .steps li[data-wald-28894e32]:hover{
    transform: translate(-2px, -2px);
    box-shadow: 10px 10px 0 var(--ir-gold);
  }
  .step-head[data-wald-28894e32]{
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .n[data-wald-28894e32]{
    font-size: 4.5rem;
    font-weight: 900;
    font-style: italic;
    line-height: 0.8;
  }
  .sign[data-wald-28894e32]{
    display: grid;
    place-items: center;
    width: 4rem;
    height: 4rem;
    border-radius: 0.8rem;
    background: var(--ir-gradient);
    color: var(--on-accent);
    box-shadow: inset 0 0 0 4px var(--on-accent), 0 0 0 3px var(--ir-yellow);
  }
  .sign svg[data-wald-28894e32]{
    width: 2.25rem;
    height: 2.25rem;
  }
  .steps h3[data-wald-28894e32]{
    font-size: var(--fs-xl);
    font-weight: 900;
    text-transform: uppercase;
  }
  .steps p[data-wald-28894e32]{
    color: var(--text-muted);
  }

  /* ── CTA block ── */
  .cta[data-wald-28894e32]{
    margin-top: var(--space-16);
    padding-block: clamp(3rem, 8vw, 5rem);
    background: var(--ir-gradient);
    color: var(--on-accent);
    border-top: 1.25rem solid transparent;
    border-image: repeating-linear-gradient(-45deg, var(--on-accent) 0 18px, var(--ir-yellow) 18px 36px) 20;
  }
  .cta-inner[data-wald-28894e32]{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-6);
  }
  .cta h2[data-wald-28894e32]{
    font-size: clamp(2rem, 1.2rem + 4vw, 3.75rem);
    font-weight: 900;
    text-transform: uppercase;
    line-height: 0.95;
  }
  .btn-brutal[data-wald-28894e32]{
    display: inline-grid;
    place-items: center;
    min-height: 3.25rem;
    padding: 0 var(--space-6);
    border: 3px solid var(--on-accent);
    font: italic 900 var(--fs-base) / 1 var(--font);
    text-transform: uppercase;
    text-decoration: none;
    transition: transform 0.12s ease, box-shadow 0.12s ease;
  }
  .btn-brutal.ink[data-wald-28894e32]{
    background: var(--on-accent);
    color: var(--ir-yellow);
    box-shadow: 6px 6px 0 var(--ir-red);
  }
  .btn-brutal[data-wald-28894e32]:hover{
    transform: translate(-2px, -2px);
  }
  .btn-brutal[data-wald-28894e32]:active{
    transform: translate(4px, 4px);
    box-shadow: none;
  }
