/*
 * Landing hero — cinematic migration
 *
 * Content and behavior stay in views/home/hero.js. This file changes only
 * composition and visual treatment. On desktop, the entire section is
 * budgeted to one viewport below the 64px fixed masthead: message, command,
 * living terminal, compatibility rail, and next-section cue.
 */

html[data-design-system="halde"] .landing-hero-static{
  --hero-rule:var(--artifact-rule);
  --hero-faint:var(--artifact-faint);
  isolation:isolate;
  position:relative;
  overflow:hidden;
  border-bottom:1px solid var(--artifact-rule);
  background:
    radial-gradient(ellipse 64% 78% at 62% 46%,rgba(0,198,220,.13),transparent 70%),
    var(--artifact-bg)!important;
  color:var(--artifact-text);
}

html[data-design-system="halde"] .landing-hero-static::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  pointer-events:none;
  opacity:.34;
  background-image:
    radial-gradient(circle,rgba(255,255,255,.36) 0 1px,transparent 1.4px),
    radial-gradient(circle,rgba(255,255,255,.16) 0 .7px,transparent 1.1px);
  background-position:0 0,17px 23px;
  background-size:47px 47px,61px 61px;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.2) 35%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.2) 35%,#000 100%);
}

html[data-design-system="halde"] .landing-hero-static.has-abyss::before{
  opacity:.08;
}

html[data-design-system="halde"] .landing-hero-static::after{
  content:"";
  position:absolute;
  z-index:1;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,var(--artifact-bg) 0%,transparent 23%,transparent 78%,var(--artifact-bg) 100%);
}

html[data-design-system="halde"] .landing-hero-static .hero-abyss{
  position:absolute;
  z-index:0;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
  opacity:1;
  filter:brightness(1.22) saturate(2.35) contrast(1.12);
  mix-blend-mode:screen;
}

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

html[data-design-system="halde"] .landing-hero-static .hero-kicker{
  margin:0 0 clamp(12px,1.8vh,18px);
  color:var(--artifact-muted);
  font:500 10px/1.4 var(--font-technical);
  letter-spacing:.12em;
  text-transform:uppercase;
}

html[data-design-system="halde"] .landing-hero-static .hero-h1{
  margin:0;
  color:var(--artifact-text);
  font-family:var(--font-editorial);
  font-variation-settings:"wght" 520,"wdth" 100;
  font-weight:520;
  letter-spacing:-.055em;
  line-height:.9;
  text-transform:none;
}

html[data-design-system="halde"] .landing-hero-static .hero-h1 span{
  display:block;
}

html[data-design-system="halde"] .landing-hero-static .hero-dek{
  color:var(--artifact-muted);
  font-weight:380;
  line-height:1.55;
}

html[data-design-system="halde"] .landing-hero-static .hero-dek mark{
  color:inherit;
}

html[data-design-system="halde"] .landing-hero-static .hero-run-real{
  gap:6px;
}

html[data-design-system="halde"] .landing-hero-static .hero-run-label{
  color:var(--artifact-faint);
  opacity:1;
}

html[data-design-system="halde"] .landing-hero-static .hero-cmd-note{
  color:var(--artifact-faint);
  font:400 9.5px/1.45 var(--font-technical);
  letter-spacing:.02em;
}

html[data-design-system="halde"] .landing-hero-static .hero-cmd-note a{
  color:var(--artifact-muted);
  font-weight:500;
  text-decoration-color:var(--artifact-rule);
}

/* The living terminal is the hero's visual media. It keeps every line and
   transport control, but sheds the old paper mat and warm color treatment. */
html[data-design-system="halde"] .landing-hero-static .hero-terminal{
  position:relative;
  z-index:2;
  min-width:0;
}

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

html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-strip{
  padding:clamp(8px,1vw,14px);
  border:1px solid var(--artifact-rule);
  border-radius:0;
  background:
    linear-gradient(135deg,rgba(255,255,255,.018),transparent 44%),
    rgba(10,10,10,.78);
  box-shadow:0 24px 70px rgba(0,0,0,.42);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-window{
  --lt-ink:#f5f5f5;
  --lt-dim:rgba(245,245,245,.62);
  --lt-faint:rgba(245,245,245,.34);
  --lt-accent:#fff;
  --lt-ok:#c8d1ca;
  --lt-bad:#b5b5b5;
  --lt-line:rgba(245,245,245,.13);
  border:1px solid var(--artifact-rule);
  border-radius:0;
  background:#06090d;
  box-shadow:none;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-titlebar{
  height:32px;
  padding-inline:12px;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-title{
  color:var(--lt-dim);
  font:400 10px/1 var(--font-technical);
  letter-spacing:.05em;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-dots{
  gap:5px;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-dots i{
  width:7px;
  height:7px;
  border-radius:0;
  background:var(--artifact-faint);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-dots i:nth-child(1){opacity:.45}
html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-dots i:nth-child(2){opacity:.7}
html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-dots i:nth-child(3){opacity:1}

html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-badge{
  border-color:var(--artifact-rule);
  border-radius:0;
  color:var(--artifact-muted);
  font-weight:500;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-body{
  padding:11px 14px 28px;
  color:var(--lt-ink);
  font-family:var(--font-technical);
  font-size:clamp(11.5px,.42vw + 8px,13px);
  line-height:1.48;
  scrollbar-color:var(--artifact-rule) transparent;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-line{
  min-height:1.48em;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-promptrow{
  min-height:32px;
  padding:6px 14px;
  font:400 12px/1.4 var(--font-technical);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-controls{
  gap:7px;
  margin:0;
  padding:8px 11px 10px;
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-progress{
  height:1px;
  margin-bottom:7px;
  border-radius:0;
  background:var(--artifact-rule);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-progress i{
  background:var(--artifact-text);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-progress u{
  background:var(--artifact-muted);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-controls button{
  width:30px;
  height:30px;
  min-height:30px;
  border:1px solid var(--artifact-rule);
  border-radius:0!important;
  background:transparent;
  color:var(--artifact-muted);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-controls button:hover{
  border-color:var(--artifact-text);
  background:var(--artifact-text);
  color:var(--artifact-bg);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-time{
  padding:9px 11px;
  border-radius:0;
  background:var(--artifact-bg-raised);
  color:var(--artifact-muted);
  font:500 10px/1 var(--font-technical);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-controls [data-lt="sound"][aria-pressed="true"]{
  background:var(--artifact-text);
  color:var(--artifact-bg);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-controls [data-lt="sound"].is-inviting::after{
  border:1px solid var(--artifact-rule);
  border-radius:0;
  background:var(--artifact-text);
  color:var(--artifact-bg);
  box-shadow:0 10px 30px rgba(0,0,0,.5);
}

/* Compatibility becomes a technical footer inside the composed screen. */
html[data-design-system="halde"] .landing-hero-static .hero-compatibility{
  flex:0 0 auto;
  position:relative;
  z-index:2;
  margin-top:0;
  border-top:1px solid var(--hero-rule);
  color:var(--artifact-muted);
}

html[data-design-system="halde"] .landing-hero-static .hero-compatibility-label{
  border-right:1px solid var(--hero-rule);
}

html[data-design-system="halde"] .landing-hero-static .hero-compatibility .harness-brand{
  border-left:1px solid var(--hero-rule);
  color:var(--artifact-faint);
  opacity:1;
}

html[data-design-system="halde"] .landing-hero-static .hero-compatibility .harness-brand:first-child{
  border-left:0;
}

html[data-design-system="halde"] .landing-hero-static .hero-compatibility .harness-brand b{
  color:var(--artifact-muted);
  font:500 9px/1.15 var(--font-technical);
  letter-spacing:.02em;
}

html[data-design-system="halde"] .landing-hero-static .hero-compatibility .harness-mark{
  filter:grayscale(1);
}

html[data-design-system="halde"] .landing-hero-static .hero-compatibility .agent-letter{
  border-radius:0;
  font-family:var(--font-technical);
  font-weight:500;
}

html[data-design-system="halde"] .landing-hero-static .hero-next-cue{
  position:relative;
  z-index:2;
  min-height:22px;
  padding:3px 0 0;
}

html[data-design-system="halde"] .landing-hero-static .hero-next-cue button{
  padding:4px 0;
  color:var(--artifact-faint);
  font:500 9px/1 var(--font-technical);
  letter-spacing:.1em;
  text-transform:uppercase;
}

html[data-design-system="halde"] .landing-hero-static .hero-next-cue button:hover{
  color:var(--artifact-text);
}

@media (min-width:961px){
  html[data-design-system="halde"] .landing-hero-static{
    width:100%;
    min-height:calc(100svh - var(--mast-offset));
    height:calc(100svh - var(--mast-offset));
    max-height:calc(100svh - var(--mast-offset));
    padding:clamp(12px,2vh,22px) var(--page-gutter) 8px;
    overflow:hidden!important;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-fold{
    flex:1 1 auto;
    min-height:0;
    display:grid;
    grid-template-columns:repeat(12,minmax(0,1fr));
    gap:0 clamp(16px,2.25vw,36px);
    align-content:center;
    align-items:center;
    width:min(100%,var(--content-max));
    margin-inline:auto;
    padding:0;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-message{
    grid-column:1 / span 4;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-terminal{
    grid-column:5 / span 8;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-h1{
    font-size:var(--type-page-title-size);
  }

  html[data-design-system="halde"] .landing-hero-static .hero-h1 span{
    white-space:nowrap;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-dek{
    max-width:34ch;
    margin:clamp(13px,2vh,22px) 0 0;
    font-size:clamp(13.5px,.45vw + 9px,16px);
  }

  html[data-design-system="halde"] .landing-hero-static .hero-run-real{
    max-width:42ch;
    margin-top:clamp(10px,1.6vh,17px);
  }

  html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-body{
    height:clamp(220px,calc(100svh - 380px),420px);
  }

  html[data-design-system="halde"] .landing-hero-static .hero-compatibility{
    width:min(100%,var(--content-max));
    min-height:48px;
    margin-inline:auto;
    grid-template-columns:minmax(160px,1.15fr) minmax(0,6.85fr);
  }

  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:48px;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-compatibility-label{
    gap:2px;
    padding-right:16px;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-compatibility .harness-brand{
    grid-template-columns:22px minmax(0,auto);
    gap:6px;
    padding:5px 7px;
  }

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

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

  html[data-design-system="halde"] .landing-hero-static .hero-compatibility .agent-letter{
    width:17px;
    height:17px;
    font-size:8px;
  }
}

@media (min-width:961px) and (max-height:700px){
  html[data-design-system="halde"] .landing-hero-static{
    padding-top:9px;
    padding-bottom:5px;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-kicker{
    margin-bottom:8px;
    font-size:9px;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-h1{
    font-size:clamp(34px,3.55vw,54px);
  }

  html[data-design-system="halde"] .landing-hero-static .hero-dek{
    margin-top:10px;
    font-size:13px;
    line-height:1.42;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-run-real{
    margin-top:8px;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-cmd-note{
    font-size:8.5px;
    line-height:1.35;
  }

  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:42px;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-next-cue{
    min-height:18px;
  }
}

@media (max-width:960px){
  html[data-design-system="halde"] .landing-hero-static{
    min-height:auto;
    padding:clamp(38px,8vw,72px) var(--page-gutter) 24px;
    overflow:visible;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-fold{
    display:grid;
    grid-template-columns:1fr;
    gap:34px;
    padding:0 0 28px;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-h1{
    font-size:var(--type-page-title-size);
  }

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

  html[data-design-system="halde"] .landing-hero-static .hero-dek{
    max-width:38ch;
    margin-top:20px;
    font-size:16px;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-run-real{
    max-width:52ch;
    margin-top:20px;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-terminal .lt-body{
    height:clamp(300px,46dvh,420px);
  }

  html[data-design-system="halde"] .landing-hero-static .hero-compatibility{
    grid-template-columns:1fr;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-compatibility-label{
    min-height:52px;
    padding:10px 0;
    border-right:0;
    border-bottom:1px solid var(--hero-rule);
  }

  html[data-design-system="halde"] .landing-hero-static .harness-dock-items{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  html[data-design-system="halde"] .landing-hero-static .hero-compatibility .harness-brand{
    justify-content:start;
    min-height:52px;
    padding:9px;
  }
}

@media (prefers-reduced-motion:reduce){
  html[data-design-system="halde"] .landing-hero-static .hero-abyss{
    display:none;
  }

  html[data-design-system="halde"] .landing-hero-static .hero-h1 span{
    transition:none;
  }
}

/* White-gallery hero direction.
   The terminal remains the high-contrast anchor; motion is peripheral. */
html[data-design-system="halde"] .landing-hero-static{
  --hero-rule:color-mix(in srgb,var(--text-primary) 14%,transparent);
  color:var(--text-primary);
  background:
    radial-gradient(circle at 76% 40%,color-mix(in srgb,var(--bg-surface-muted) 34%,transparent),transparent 31%),
    linear-gradient(115deg,var(--bg-page) 0 55%,color-mix(in srgb,var(--bg-paper) 80%,var(--bg-page)) 100%) !important;
  border-color:var(--border-default);
}

html[data-design-system="halde"] .landing-hero-static::before{
  background-image:radial-gradient(circle,color-mix(in srgb,var(--bg-inverse) 36%,transparent) .65px,transparent .8px);
  background-size:19px 19px;
  opacity:.08;
  mask-image:linear-gradient(90deg,transparent 35%,black 72%);
}

html[data-design-system="halde"] .landing-hero-static.has-abyss::before{
  opacity:.025;
}

html[data-design-system="halde"] .landing-hero-static::after{
  background:
    linear-gradient(90deg,var(--bg-page) 0%,color-mix(in srgb,var(--bg-page) 94%,transparent) 31%,transparent 61%),
    linear-gradient(180deg,color-mix(in srgb,var(--bg-page) 84%,transparent),transparent 16% 82%,color-mix(in srgb,var(--bg-page) 80%,transparent));
}

html[data-design-system="halde"] .landing-hero-static .hero-abyss{
  inset:0 0 0 auto;
  width:69%;
  height:100%;
  z-index:3;
  opacity:.26;
  filter:saturate(.58) contrast(1.04);
  mix-blend-mode:screen;
  mask-image:linear-gradient(90deg,transparent 0%,black 31%,black 100%);
}

html[data-design-system="halde"] .landing-hero-static .hero-kicker{
  color:var(--accent);
}

html[data-design-system="halde"] .landing-hero-static .hero-h1,
html[data-design-system="halde"] .landing-hero-static .hero-h1 mark{
  color:var(--text-primary);
}

html[data-design-system="halde"] .landing-hero-static .hero-dek{
  color:color-mix(in srgb,var(--text-primary) 70%,transparent);
}

html[data-design-system="halde"] .landing-hero-static .hero-run-real-label,
html[data-design-system="halde"] .landing-hero-static .hero-cmd-note,
html[data-design-system="halde"] .landing-hero-static .hero-cmd-links a{
  color:color-mix(in srgb,var(--text-primary) 58%,transparent);
}

html[data-design-system="halde"] .landing-hero-static .hero-run-real-command{
  color:var(--text-primary);
  background:color-mix(in srgb,var(--text-primary) 94%,black);
  border-color:color-mix(in srgb,var(--text-primary) 74%,black);
  box-shadow:0 16px 40px color-mix(in srgb,var(--text-primary) 12%,transparent);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal-strip{
  color:var(--text-primary);
  background:color-mix(in srgb,var(--bg-surface) 88%,transparent);
  border-color:var(--border-default);
  box-shadow:0 26px 70px color-mix(in srgb,var(--text-primary) 11%,transparent);
}

html[data-design-system="halde"] .landing-hero-static .hero-terminal{
  --lt-accent:#dd9a76;
  --lt-ok:#8fc79b;
  --lt-bad:#e08a72;
  border-color:color-mix(in srgb,var(--text-primary) 46%,transparent);
}

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{
  color:color-mix(in srgb,var(--text-primary) 66%,transparent);
  border-color:var(--hero-rule);
}

html[data-design-system="halde"] .landing-hero-static .hero-next-cue{
  color:color-mix(in srgb,var(--text-primary) 48%,transparent);
}

html[data-design-system="halde"] .landing-hero-static .hero-next-cue:hover{
  color:var(--accent);
}
