.landing-agent-intro {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 0 0 13px;
  padding: 12px 14px;
  border: 1px solid #23566b;
  border-radius: 11px;
  background: linear-gradient(135deg, #092434, #04131e);
  text-align: start;
}
.landing-agent-intro > i {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  flex: none;
  border-radius: 9px;
  background: linear-gradient(135deg, #38e5e4, #0c7187);
  color: #fff;
  font-style: normal;
}
.landing-agent-intro b {
  display: block;
  color: var(--cyan);
  font-size: 8px;
  letter-spacing: .18em;
}
.landing-agent-intro p {
  margin: 5px 0 0;
  color: #bdd0d8;
  font-size: 11px;
  line-height: 1.75;
}

/* v0.10: a deliberately contrasting AI console on the dark cinematic stage. */
.hero-v6::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse 72% 45% at 50% 25%, rgba(2, 9, 20, .96), rgba(2, 9, 20, .72) 62%, transparent 100%),
    linear-gradient(180deg, rgba(2, 9, 20, .36), transparent 72%);
}
.hero-v6 > * { position: relative; z-index: 1; }
.hero-v6 > .hero-orbit { position: absolute; z-index: 0; opacity: .42; }
.hero-v6 h1 { margin-bottom: 28px; }

.prompt-console {
  background: linear-gradient(145deg, #fffdf8 0%, #f5edde 58%, #ead8b9 100%);
  border: 1px solid #f0c77b;
  box-shadow: 0 30px 90px rgba(0, 0, 0, .68), 0 0 44px rgba(232, 183, 104, .2), inset 0 1px #fff;
  color: #071523;
}
.prompt-console::before { background: linear-gradient(130deg, #fff, #e2a94c 44%, #37cdd0 100%); }
.landing-agent-intro {
  background: rgba(6, 22, 35, .97);
  border-color: #b88a43;
  box-shadow: 0 12px 30px rgba(7, 20, 31, .18);
}
.prompt-console > label { color: #4d5d68; font-weight: 700; }
.prompt-row {
  padding: 9px 12px;
  border: 1px solid rgba(12, 54, 72, .18);
  border-radius: 13px;
  background: rgba(255, 255, 255, .76);
  box-shadow: inset 0 1px #fff;
}
.prompt-row textarea { color: #071523; font-weight: 650; }
.prompt-row textarea::placeholder { color: #5c6b74; }
.prompt-tools { border-top-color: rgba(12, 54, 72, .16); }
.attach-trigger { background: #fffaf1; color: #17303e; border-color: #c7a568; }
.prompt-note { color: #5c6870; }
.generate-btn { background: linear-gradient(135deg, #e2ab51, #b97827); border-color: #f4d498; color: #10161a; }

.demo-visual { display: block; background: #07131f; }
.demo-visual::before, .demo-visual::after { display: none; }
.demo-visual img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .65s ease, filter .65s ease; }
.demo-visual::after {
  content: "";
  display: block;
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 42%, rgba(2, 9, 20, .76));
}
.demo-card:hover .demo-visual img { transform: scale(1.055); filter: saturate(1.08); }
.demo-visual span {
  position: absolute;
  z-index: 2;
  inset-inline-start: 12px;
  bottom: 10px;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: rgba(3, 13, 23, .78);
  border: 1px solid rgba(255, 255, 255, .24);
  font-size: 18px;
  color: #fff;
  text-shadow: none;
  backdrop-filter: blur(8px);
}
.demo-visual b { z-index: 2; color: #fff; text-shadow: 0 2px 10px #000; }

@media (max-width: 700px) {
  .hero-v6 h1 { margin-bottom: 22px; }
  .prompt-console { width: 100%; }
  .prompt-row { align-items: flex-start; }
}
@media (max-width: 650px) {
  .landing-agent-intro p { font-size: 10px; }
  .landing-agent-intro > i { width: 32px; height: 32px; }
}