/*
 * Integrated hero field — kinetic proof sheet.
 *
 * The recorded execution is evidence inside the editorial canvas—not a
 * terminal screenshot beside it. The living-terminal engine and every line,
 * narration clip, chapter, replay action and seek target remain intact. Only
 * the projection surface changes: the trace plays as a piece of recorded
 * evidence, without terminal or device chrome. The current event stays crisp
 * while earlier events recede like carbon copies of the run.
 */

html[data-design-system="halde"] .landing-hero-static{
  --hero-field-ink:var(--text-primary);
  --hero-field-dim:var(--text-secondary);
  --hero-field-faint:var(--text-tertiary);
  background:
    radial-gradient(ellipse 48% 64% at 78% 44%,rgba(240,79,35,.055),transparent 68%),
    transparent!important;
}

html[data-design-system="halde"] .landing-hero-static::before{
  opacity:.5;
  background:radial-gradient(circle,var(--border-default) 0 .55px,transparent .75px);
  background-size:20px 20px;
}

html[data-design-system="halde"] .landing-hero-static::after{
  background:
    linear-gradient(90deg,var(--bg-page) 0 28%,color-mix(in srgb,var(--bg-page) 88%,transparent) 43%,transparent 66%),
    linear-gradient(180deg,var(--bg-page) 0,transparent 12%,transparent 86%,var(--bg-page) 100%);
}

html[data-design-system="halde"] .landing-hero-static .hero-abyss{
  right:0;
  left:auto;
  width:70%;
  opacity:.17;
  filter:grayscale(.58) sepia(.18) contrast(1.32);
  mix-blend-mode:var(--texture-blend);
  -webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.36) 28%,#000 58%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.36) 28%,#000 58%,#000 100%);
}

html[data-design-system="halde"] .landing-hero-static .hero-message{
  z-index:4;
}

/* These lines explain how to act on the Play and where it works. They are
   interface guidance, not legal fine print, so keep them above the perceptual
   floor even on wide displays. */
html[data-design-system="halde"] .landing-hero-static .hero-cmd-note{
  max-width:66ch;
  color:var(--text-secondary);
  font:500 clamp(12px,.22vw + 9.5px,14px)/1.5 var(--font-technical);
  letter-spacing:.015em;
}

html[data-design-system="halde"] .landing-hero-static .hero-compatibility-label .lab{
  color:var(--text-primary);
  font-size:11px;
  line-height:1.25;
  letter-spacing:.07em;
}

html[data-design-system="halde"] .landing-hero-static .hero-compatibility .harness-brand b{
  color:var(--text-primary);
  font:540 12px/1.2 var(--font-technical);
  letter-spacing:.01em;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated{
  --film-field:var(--bg-page);
  --film-ink:var(--text-primary);
  --film-paper:var(--accent);
  --film-rule:var(--border-strong);
  isolation:isolate;
  position:relative;
  z-index:3;
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
  align-self:stretch;
  padding:clamp(58px,7vh,92px) clamp(20px,2.8vw,52px) clamp(28px,4vh,48px) clamp(44px,4.5vw,84px);
  border-left:0!important;
  background:
    radial-gradient(ellipse 70% 62% at 48% 45%,color-mix(in srgb,var(--film-ink) 3.5%,transparent),transparent 72%),
    transparent!important;
  box-shadow:none;
  color:var(--film-ink)!important;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated::before{
  content:"LIVE TRACE  /  REC 01";
  position:absolute;
  z-index:3;
  top:clamp(22px,3.2vh,38px);
  left:clamp(44px,4.5vw,84px);
  color:var(--film-ink);
  font:700 9px/1 var(--font-technical);
  letter-spacing:.16em;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated::after{
  content:"OBSERVED EXECUTION  ·  FRAME 0001";
  position:absolute;
  z-index:3;
  right:clamp(20px,2.8vw,52px);
  bottom:clamp(12px,1.8vh,22px);
  color:color-mix(in srgb,var(--film-ink) 62%,transparent);
  font:650 8px/1 var(--font-technical);
  letter-spacing:.14em;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .terminal-stack{
  position:relative;
  width:100%;
  min-width:0;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .terminal-stack::before{
  content:"TRACE / 01";
  position:absolute;
  top:2px;
  top:50%;
  right:-.04em;
  left:auto;
  z-index:-1;
  color:color-mix(in srgb,var(--film-ink) 3.5%,transparent);
  font:560 clamp(92px,10vw,208px)/.78 var(--font-editorial);
  letter-spacing:-.08em;
  white-space:nowrap;
  transform:translateY(-50%);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-wrap,
html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-strip,
html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-window{
  width:100%;
  max-width:none;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-window{
  --lt-ink:var(--film-ink)!important;
  --lt-dim:color-mix(in srgb,var(--film-ink) 88%,transparent)!important;
  --lt-faint:color-mix(in srgb,var(--film-ink) 66%,transparent)!important;
  --lt-line:var(--film-rule)!important;
  --lt-accent:var(--film-paper)!important;
  --lt-ok:var(--positive)!important;
  --lt-bad:var(--danger)!important;
  position:relative;
  overflow:visible;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-titlebar{
  height:30px;
  margin:0 0 12px;
  padding:0 0 10px;
  border:0;
  border-bottom:0;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-title{
  text-align:left;
  color:var(--film-ink);
  font:680 9px/1 var(--font-technical);
  letter-spacing:.13em;
  text-transform:uppercase;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-dots{
  display:none;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-balance{
  margin-left:auto;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-badge{
  color:color-mix(in srgb,var(--film-ink) 64%,transparent);
  font-size:8px;
  letter-spacing:.13em;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-body{
  height:clamp(300px,calc(100svh - 360px),510px);
  padding:clamp(18px,2.5vh,30px) 0 34px;
  overflow:hidden;
  --lt-ink:var(--film-ink)!important;
  --lt-dim:color-mix(in srgb,var(--film-ink) 88%,transparent)!important;
  --lt-faint:color-mix(in srgb,var(--film-ink) 66%,transparent)!important;
  color:var(--lt-ink)!important;
  font:540 clamp(17px,calc(.7vw + 8px),22px)/1.52 var(--font-technical);
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 7%,#000 88%,transparent 100%);
  mask-image:linear-gradient(180deg,transparent 0,#000 7%,#000 88%,transparent 100%);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-line,
html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-coldline{
  max-width:74ch;
  color:var(--lt-dim)!important;
  text-shadow:none;
  transition:opacity .24s ease,color .24s ease;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-body > .lt-line:not(:last-child),
html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-coldopen .lt-coldline:not(:last-child){
  opacity:.74;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-body > .lt-line.work:last-child{
  color:var(--lt-ink)!important;
  font-weight:610;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-line.cmd{
  margin-top:9px;
  color:var(--lt-ink)!important;
  font-weight:610;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-line.cmd::before{
  color:var(--film-paper)!important;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-line.out.save,
html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-line.out.uri,
html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-cold-correct,
html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-cold-rote{
  color:var(--film-paper)!important;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-line.ask,
html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-line.say{
  width:auto;
  max-width:70ch;
  margin:9px 0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent!important;
  color:var(--lt-ink);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-promptrow{
  min-height:36px;
  margin:0;
  padding:8px 0;
  border:0;
  border-top:0;
  border-bottom:1px solid var(--film-rule);
  border-radius:0;
  background:transparent!important;
  color:var(--lt-ink);
  font:540 clamp(14px,calc(.4vw + 8px),16px)/1.45 var(--font-technical);
  transition:opacity .16s ease;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-promptrow:has(.lt-typed:empty){
  opacity:0;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-caret,
html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-cursor{
  background:var(--film-paper);
  color:var(--film-paper);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-statusbar{
  display:none!important;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-controls{
  min-height:52px;
  margin:0;
  padding:10px 0 0;
  border:0;
  color:var(--lt-dim);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-progress{
  order:0;
  height:2px;
  margin-right:clamp(12px,2vw,28px);
  background:color-mix(in srgb,var(--film-ink) 30%,transparent);
  outline:none;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-progress::before{
  inset:-12px 0;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-progress i{
  position:relative;
  background:var(--film-ink);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-progress i::after{
  content:"";
  position:absolute;
  top:50%;
  right:-5px;
  width:10px;
  height:10px;
  border:2px solid var(--film-field);
  border-radius:50%;
  background:var(--film-paper);
  box-shadow:0 0 0 1px var(--film-ink);
  transform:translateY(-50%);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-progress u{
  display:block;
  top:-3px;
  bottom:-3px;
  width:1px;
  background:color-mix(in srgb,var(--film-ink) 52%,transparent);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-progress:focus-visible{
  box-shadow:0 0 0 4px color-mix(in srgb,var(--film-paper) 30%,transparent);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-controls button{
  flex-basis:34px;
  width:34px;
  height:34px;
  min-height:34px;
  border:1px solid transparent;
  border-radius:0!important;
  color:var(--film-ink);
  opacity:1;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-controls button:hover,
html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-controls button:focus-visible{
  border-color:var(--film-ink);
  background:var(--film-paper);
  color:var(--film-ink);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-controls [data-lt="sound"]{
  color:var(--film-ink);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-controls [data-lt="sound"][aria-pressed="true"]{
  border-color:var(--film-ink);
  background:var(--film-ink);
  color:var(--film-paper);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-time{
  min-width:78px;
  color:var(--film-ink);
  font:560 10px/1 var(--font-technical);
  letter-spacing:.035em;
  text-align:right;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-controls [data-lt="sound"].is-inviting::after{
  border-color:var(--film-ink);
  background:var(--film-paper);
  color:var(--film-ink);
}

@media (min-width:961px){
  html[data-design-system="halde"] .landing-hero-static .hero-fold{
    grid-template-columns:repeat(12,minmax(0,1fr));
    gap:0 clamp(12px,1.8vw,30px);
    align-content:stretch;
    align-items:center;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-message{
    grid-column:1 / span 5;
    min-width:0;
    max-width:100%;
    align-self:center;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated{
    grid-column:6 / -1;
    margin-left:clamp(-28px,-1.4vw,-14px);
  }

  html[data-design-system="halde"] .landing-hero-static .hero-h1 span{
    max-width:100%;
    white-space:normal;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-compatibility,
  html[data-design-system="halde"] .landing-hero-static .hero-compatibility-label,
  html[data-design-system="halde"] .landing-hero-static .hero-compatibility .harness-brand{
    min-height:58px;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-compatibility-label .lab{
    font-size:11px;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-compatibility .harness-brand b{
    font-size:clamp(11.5px,.16vw + 9.5px,13px);
  }

  html[data-design-system="halde"] .landing-hero-static .hero-compatibility .harness-mark{
    width:24px;
    height:24px;
    flex-basis:24px;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-compatibility .harness-mark svg{
    width:22px;
    height:22px;
  }
}

@media (min-width:961px) and (max-height:800px){
  html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-body{
    height:clamp(205px,calc(100svh - 370px),310px);
    padding-block:14px 20px;
    font-size:16px;
    line-height:1.48;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-titlebar{
    margin-bottom:2px;
  }
}

@media (max-width:960px){
  html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated::before{
    top:24px;
    left:var(--page-gutter);
  }

  html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated{
    margin-inline:calc(var(--page-gutter) * -1);
    padding:64px var(--page-gutter) 36px;
    border-left:0!important;
    border-block:0;
    background:transparent!important;
    box-shadow:none;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated::after{
    right:var(--page-gutter);
    bottom:16px;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .terminal-stack::before{
    right:-.02em;
    display:block;
    font-size:clamp(72px,20vw,132px);
  }

  html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-body{
    height:300px;
    font-size:clamp(15px,2.8vw,18px);
  }

  html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-controls button{
    flex-basis:40px;
    width:40px;
    height:40px;
    min-height:40px;
  }
}

@media (prefers-reduced-motion:reduce){
  html[data-design-system="halde"] .landing-hero-static .hero-terminal-integrated .lt-progress i::after{
    transition:none;
  }
}
