/* ============================================================
   HIRED & READY — "Neon Terminal" design system  v3
   Nexio motion DNA (pinned hero curtain, staggered reveals,
   sticky slide-over stack, scrollspy nav) × AutoFinish neon
   (#B8FF00 on near-black) × matrix binary rain.
   Hand-built by Humi, Jul 2026. No frameworks, no tracking.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Unbounded:wght@500;600;700;800&family=Outfit:wght@400;500;600;700&family=Share+Tech+Mono&display=swap');

:root {
  --bg:        #030608;   /* AutoFinish near-black */
  --bg-soft:   #060B0D;
  --panel:     #0A100F;
  --panel-2:   #0D1412;
  --ink:       #E9F2E4;   /* off-white text on dark */
  --dim:       #8FA096;
  --neon:      #B8FF00;   /* AutoFinish neon */
  --neon-soft: rgba(184, 255, 0, 0.14);
  --neon-line: rgba(184, 255, 0, 0.38);
  --green-crt: #4DFF88;
  --amber:     #FFAA00;
  --red:       #FF4444;

  --font-display: "Unbounded", "Helvetica Neue", Arial, sans-serif;
  --font-body:    "Outfit", "Helvetica Neue", Arial, sans-serif;
  --font-mono:    "Share Tech Mono", ui-monospace, monospace;

  --container: min(92vw, 1320px);
  --nav-h: 72px;
  --space-section: clamp(4.5rem, 9vw, 7.5rem);
  --space-block: clamp(2.25rem, 5vw, 3.5rem);

  --border: 1px solid var(--neon-line);
  --glow: 0 0 22px rgba(184, 255, 0, 0.14), inset 0 0 22px rgba(184, 255, 0, 0.04);
  --glow-strong: 0 0 34px rgba(184, 255, 0, 0.3);
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  font-family: var(--font-body);
  background: var(--bg);
  color: var(--ink);
  line-height: 1.6;
  font-size: 1.0625rem;
  -webkit-font-smoothing: antialiased;
  padding-top: var(--nav-h);
}

::selection { background: var(--neon); color: #000; }
.container { width: var(--container); margin-inline: auto; }

/* ---------- reveals (Nexio's exact curve) ---------- */
.reveal {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity 0.7s ease var(--d, 0s), transform 0.7s cubic-bezier(0.22, 0.8, 0.3, 1) var(--d, 0s);
}
.reveal.in { opacity: 1; transform: none; }

/* ---------- type ---------- */
h1, h2, h3, .display {
  font-family: var(--font-display);
  font-weight: 700;
  line-height: 1.14;
  letter-spacing: -0.01em;
  color: #fff;
}
h1 { font-size: clamp(2rem, 5vw, 3.6rem); }
h2 { font-size: clamp(1.5rem, 3.4vw, 2.4rem); }
h3 { font-size: clamp(1.2rem, 2vw, 1.5rem); line-height: 1.15; }
.h1-line { display: block; }
.h1-line--neon { color: var(--neon); text-shadow: 0 0 28px rgba(184,255,0,0.35); }
.lead { font-size: clamp(1.1rem, 1.8vw, 1.3rem); line-height: 1.55; max-width: 46ch; color: var(--ink); }
.muted { color: var(--dim); }

.pixel { font-family: var(--font-mono); font-size: 0.86rem; letter-spacing: 0.1em; line-height: 1.7; }
.eyebrow {
  font-family: var(--font-mono); font-size: 0.86rem; letter-spacing: 0.16em;
  color: var(--neon); display: inline-flex; align-items: center; gap: 0.65em; margin-bottom: 1.1rem;
  text-transform: uppercase;
}
.eyebrow::before { content: ">"; color: var(--neon); }
.level-tag {
  display: inline-block; font-family: var(--font-mono); font-size: 0.85rem; letter-spacing: 0.14em;
  color: var(--neon); background: var(--neon-soft);
  padding: 0.45em 1em; border: 1px solid var(--neon-line); box-shadow: var(--glow);
  margin-bottom: 1.4rem; text-transform: uppercase;
}

/* ---------- nav ---------- */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  height: var(--nav-h);
  background: rgba(3, 6, 8, 0.88);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(184, 255, 0, 0.18);
  transition: border-color 0.25s ease, box-shadow 0.25s ease;
}
.nav--scrolled { border-bottom-color: var(--neon-line); box-shadow: 0 0 30px rgba(184, 255, 0, 0.1); }
.nav__inner {
  width: var(--container); margin-inline: auto; height: 100%;
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
}
.logo {
  font-family: var(--font-display);   font-weight: 900; font-size: 1.35rem; text-decoration: none; color: #fff;
  display: flex; align-items: center; gap: 0.6rem; white-space: nowrap;
}
.logo__coin {
  width: 12px; height: 22px; flex: none;
  background: var(--neon);
  box-shadow: 0 0 14px rgba(184, 255, 0, 0.7);
  animation: blink 1.3s steps(2, start) infinite;
}
.nav__links { display: flex; align-items: center; gap: clamp(0.9rem, 2.4vw, 2rem); list-style: none; }
.nav__links a:not(.btn) {
  text-decoration: none; color: var(--ink); font-weight: 600; font-size: 0.95rem;
  border-bottom: 2px solid transparent; padding-bottom: 2px;
}
.nav__links a:not(.btn):hover { color: var(--neon); }
.nav__links a[aria-current="true"] { border-bottom-color: var(--neon); color: var(--neon); }
@media (max-width: 720px) { .nav__links a:not(.btn):not(.nav-keep) { display: none; } }

/* ---------- buttons ---------- */
.btn {
  display: inline-flex; align-items: center; gap: 0.6em;
  font-family: var(--font-body); font-weight: 700; font-size: 1rem;
  text-decoration: none; cursor: pointer;
  padding: 0.85em 1.6em;
  border: 1px solid var(--neon);
  background: transparent; color: var(--neon); white-space: nowrap;
  transition: box-shadow 0.15s ease, background 0.15s ease, color 0.15s ease, transform 0.1s ease;
}
.btn:hover { box-shadow: var(--glow-strong); transform: translateY(-1px); }
.btn:active { transform: translateY(1px); box-shadow: 0 0 10px rgba(184,255,0,0.2); }
.btn--start { background: var(--neon); color: #000; box-shadow: 0 0 24px rgba(184, 255, 0, 0.35); }
.btn--start:hover { box-shadow: 0 0 44px rgba(184, 255, 0, 0.55); }
.btn--start .btn__blink { animation: blink 1.15s steps(2, start) infinite; }
.btn--ghost { border-color: rgba(184,255,0,0.4); }
@keyframes blink { 50% { opacity: 0; } }

/* ---------- marquee ---------- */
.marquee {
  border-top: 1px solid var(--neon-line); border-bottom: 1px solid var(--neon-line);
  background: var(--neon); overflow: hidden; white-space: nowrap; padding: 0.7rem 0;
  position: relative; z-index: 5;
}
.marquee__track {
  display: inline-block;
  font-family: var(--font-mono); font-size: 0.9rem; letter-spacing: 0.14em; color: #000;
  animation: marquee 28s linear infinite;
}
.marquee__track span { margin-right: 2.2em; }
@keyframes marquee { to { transform: translateX(-50%); } }

/* ---------- hero: full viewport, pinned; next section slides over ---------- */
.hero-wrap { position: relative; }
.hero--pin {
  position: sticky; top: var(--nav-h); z-index: 1;
  min-height: calc(100vh - var(--nav-h));
  min-height: calc(100svh - var(--nav-h));
  display: flex; align-items: center;
  overflow: hidden;
  transform-origin: center top;
  will-change: transform, filter;
  background: var(--bg);
}
.rain {  /* matrix binary curtain */
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  /* canvas is a REPLACED element: inset alone will not stretch it — explicit size required */
  width: 100%; height: 100%;
  opacity: 0.8;
}
.hero--pin::after {  /* keep copy legible over the rain — but let the curtains read everywhere */
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background:
    linear-gradient(100deg, rgba(3, 6, 8, 0.82) 0%, rgba(3, 6, 8, 0.6) 42%, rgba(3, 6, 8, 0.22) 68%, rgba(3, 6, 8, 0.1) 100%);
}
.hero__grid {
  position: relative; z-index: 1;
  width: var(--container); margin-inline: auto;
  display: grid; grid-template-columns: 1.05fr 0.95fr;
  gap: clamp(2rem, 5vw, 4.5rem); align-items: center;
  padding-block: clamp(2rem, 5vh, 4rem);
}
@media (max-width: 900px) { .hero__grid { grid-template-columns: 1fr; } }
.hero__sub { margin: 1.4rem 0 2rem; }
.hero__ctas { display: flex; flex-wrap: wrap; gap: 1.1rem; align-items: center; }
.hero__note { margin-top: 1.3rem; font-size: 0.9rem; color: var(--dim); }
.hero__scrollcue {
  position: absolute; left: 50%; bottom: 1.2rem; transform: translateX(-50%);
  font-family: var(--font-mono); font-size: 0.75rem; letter-spacing: 0.2em; color: var(--dim);
  display: flex; flex-direction: column; align-items: center; gap: 0.4rem; z-index: 1;
}
.hero__scrollcue i { animation: cueBounce 1.6s ease-in-out infinite; font-style: normal; color: var(--neon); }
@keyframes cueBounce { 0%,100% { transform: translateY(0); } 50% { transform: translateY(7px); } }

.cover-start { position: relative; z-index: 10; }
.cover-start.section { border-top: 1px solid var(--neon-line); box-shadow: 0 -18px 50px rgba(0,0,0,0.65); }

/* ---------- CRT terminal (native to this theme) ---------- */
.floaters { position: relative; }
.crt {
  position: relative;
  background: rgba(5, 10, 8, 0.92);
  border: 1px solid var(--neon-line);
  box-shadow: var(--glow), 0 24px 60px rgba(0,0,0,0.6);
  padding: 1.1rem 1.2rem 1.4rem;
  opacity: 0; transform: scaleY(0.02);
  transform-origin: center center;
}
.crt--on { animation: crtPowerOn 0.55s cubic-bezier(0.2, 0.9, 0.3, 1.2) 0.15s forwards; }
@keyframes crtPowerOn {
  0%   { opacity: 0; transform: scaleY(0.02); }
  40%  { opacity: 1; transform: scaleY(0.02); }
  70%  { transform: scaleY(1.06); }
  100% { opacity: 1; transform: scaleY(1); }
}
.crt::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(0deg, rgba(255,255,255,0.035) 0 1px, transparent 1px 3px);
}
.crt__bar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.9rem; }
.crt__title { font-family: var(--font-mono); font-size: 0.8rem; letter-spacing: 0.14em; color: var(--neon); }
.crt__leds { display: flex; gap: 6px; }
.crt__leds i { width: 9px; height: 9px; display: block; border-radius: 50%; }
.crt__leds i:nth-child(1) { background: var(--red); box-shadow: 0 0 8px var(--red); }
.crt__leds i:nth-child(2) { background: var(--amber); box-shadow: 0 0 8px var(--amber); }
.crt__leds i:nth-child(3) { background: var(--neon); box-shadow: 0 0 8px var(--neon); }
.crt__screen {
  font-family: var(--font-mono); font-size: clamp(0.8rem, 1.35vw, 0.95rem);
  color: var(--neon); line-height: 1.9; min-height: 11.4em;
  text-shadow: 0 0 8px rgba(184,255,0,0.5);
  overflow: hidden;
}
.crt__screen .dim { color: #5d7a1e; }
.crt__cursor { display: inline-block; width: 0.62em; height: 1.05em; background: var(--neon); vertical-align: -0.15em; animation: blink 0.9s steps(2, start) infinite; }

/* ---------- sections ---------- */
.section { padding: var(--space-section) 0; position: relative; background: var(--bg); }
.section--paper { background: var(--bg-soft); }
.section--crt { background: var(--bg-soft); border-top: 1px solid var(--neon-line); border-bottom: 1px solid var(--neon-line); }
.section__head { max-width: 62ch; margin-bottom: var(--space-block); }
.section__head p { margin-top: 1rem; }

/* thesis 3-col */
.thesis { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.2rem, 2.5vw, 2rem); }
@media (max-width: 900px) { .thesis { grid-template-columns: 1fr; } }
.thesis__card {
  background: var(--panel); border: 1px solid rgba(184,255,0,0.22);
  box-shadow: 0 14px 34px rgba(0,0,0,0.4);
  padding: 1.6rem 1.5rem;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.thesis__card:hover { border-color: var(--neon-line); box-shadow: var(--glow), 0 14px 34px rgba(0,0,0,0.4); }
.thesis__card h3 { margin: 0.9rem 0 0.6rem; }
.thesis__num { font-family: var(--font-mono); font-size: 0.8rem; letter-spacing: 0.14em; color: var(--neon); }

/* ---------- helper STACK (sticky slide-over — the Nexio moment) ---------- */
.stack { display: grid; gap: 4.5rem; padding-bottom: 1rem; }
.stack .cart {
  position: sticky;
  top: calc(var(--nav-h) + 1.6rem + var(--i, 0) * 1.1rem);
  z-index: calc(1 + var(--i, 0));
  transform-origin: center top;
  will-change: transform, filter;
  display: grid; grid-template-columns: 0.85fr 1.15fr;
  min-height: clamp(340px, 40vw, 460px);
  background: var(--panel); border: 1px solid var(--neon-line);
  box-shadow: var(--glow), 0 30px 70px rgba(0,0,0,0.65);
  overflow: hidden;
}
@media (max-width: 900px) { .stack .cart { grid-template-columns: 1fr; min-height: 0; } }
.cart__label {
  position: relative;
  background:
    linear-gradient(160deg, rgba(184,255,0,0.14) 0%, rgba(184,255,0,0.03) 60%),
    var(--panel-2);
  padding: 2rem 1.8rem;
  display: flex; flex-direction: column; justify-content: space-between;
  border-right: 1px solid var(--neon-line);
}
@media (max-width: 900px) { .cart__label { border-right: none; border-bottom: 1px solid var(--neon-line); padding: 1.5rem 1.4rem; } }
.cart__label::before {  /* binary strip */
  content: "01001000 01100101 01101100 01110000 01100101 01110010";
  position: absolute; top: 0.7rem; left: 1.8rem; right: 1rem;
  font-family: var(--font-mono); font-size: 0.6rem; letter-spacing: 0.1em;
  color: rgba(184, 255, 0, 0.25);
  white-space: nowrap; overflow: hidden;
}
.cart__label .pixel { color: var(--neon); font-size: 0.8rem; margin-top: 1.6rem; }
.cart__label h3 { color: #fff; font-size: clamp(1.7rem, 3vw, 2.5rem); margin-top: 0.7rem; }
.cart__price { font-family: var(--font-mono); font-size: 1.35rem; color: var(--neon); margin-top: 1.5rem; text-shadow: 0 0 12px rgba(184,255,0,0.4); }
.cart__price small { display: block; font-family: var(--font-body); font-size: 0.85rem; font-weight: 500; color: var(--dim); margin-top: 0.4rem; max-width: 30ch; text-shadow: none; }
.cart__body { padding: 2rem 1.8rem; display: flex; flex-direction: column; gap: 1.2rem; }
@media (max-width: 900px) { .cart__body { padding: 1.5rem 1.4rem; } }
.cart__body .blurb { color: var(--ink); font-size: 1.05rem; max-width: 48ch; }
.cart__features { list-style: none; display: grid; gap: 0.6rem; }
.cart__features li { padding-left: 1.7em; position: relative; font-weight: 500; color: var(--ink); }
.cart__features li::before {
  content: "✓"; position: absolute; left: 0; top: 0;
  font-weight: 900; color: var(--neon); text-shadow: 0 0 8px rgba(184,255,0,0.5);
}
.cart__body .btn { margin-top: auto; align-self: flex-start; }

/* ---------- steps ---------- */
.levels { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(1.1rem, 2vw, 1.8rem); }
@media (max-width: 980px) { .levels { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) { .levels { grid-template-columns: 1fr; } }
.level {
  background: var(--panel); border: 1px solid rgba(184,255,0,0.22);
  box-shadow: 0 14px 34px rgba(0,0,0,0.4); padding: 1.4rem 1.3rem;
  transition: border-color 0.2s ease;
}
.level:hover { border-color: var(--neon-line); }
.level__badge {
  font-family: var(--font-mono); font-size: 0.78rem; letter-spacing: 0.12em;
  background: transparent; color: var(--neon); display: inline-block;
  padding: 0.35em 0.7em; border: 1px solid var(--neon-line); margin-bottom: 1rem;
}
.level--done .level__badge { background: var(--neon); color: #000; box-shadow: 0 0 14px rgba(184,255,0,0.35); }
.level h3 { font-size: 1.15rem; margin-bottom: 0.5rem; }
.level p { font-size: 0.95rem; color: var(--dim); }

/* ---------- house rules ---------- */
.rules { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.2rem, 2.5vw, 2rem); }
@media (max-width: 900px) { .rules { grid-template-columns: 1fr; } }
.rule {
  border: 1px solid var(--neon-line); padding: 1.5rem 1.4rem;
  background: rgba(184, 255, 0, 0.045);
  box-shadow: var(--glow);
}
.rule .pixel { color: var(--neon); font-size: 0.8rem; }
.rule h3 { color: #fff; margin: 0.8rem 0 0.55rem; font-size: 1.15rem; }
.rule p { color: var(--dim); font-size: 0.95rem; }

/* ---------- CTA band + footer ---------- */
.cta-band { text-align: center; padding: var(--space-section) 0; position: relative; background: var(--bg); overflow: hidden; }
.cta-band .container { position: relative; z-index: 1; }
.cta-band h2 { margin-bottom: 1rem; }
.cta-band .lead { margin: 0 auto 2.2rem; }
.cta-band .hero__ctas { justify-content: center; }
.cta-band .rain { opacity: 0.35; }
.cta-band::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(70% 80% at 50% 50%, rgba(3,6,8,0.9) 0%, rgba(3,6,8,0.4) 70%, rgba(3,6,8,0.1) 100%);
}
.cta-band .container { position: relative; z-index: 2; }

.footer { background: var(--bg); color: var(--dim); border-top: 1px solid var(--neon-line); padding: 2.6rem 0; font-size: 0.9rem; position: relative; z-index: 10; }
.footer__inner { display: flex; flex-wrap: wrap; gap: 1.4rem; align-items: center; justify-content: space-between; }
.footer a { color: var(--ink); text-decoration: none; font-weight: 600; }
.footer a:hover { color: var(--neon); }
.footer .pixel { font-size: 0.8rem; color: var(--neon); letter-spacing: 0.18em; }
.footer__links { display: flex; gap: 1.4rem; flex-wrap: wrap; }

/* ---------- detail pages ---------- */
.detail-hero { padding: var(--space-section) 0 var(--space-block); position: relative; background: var(--bg); overflow: hidden; }
.detail-hero .rain { opacity: 0.4; }
.detail-hero::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(90% 90% at 35% 40%, rgba(3,6,8,0.92) 0%, rgba(3,6,8,0.5) 60%, rgba(3,6,8,0.12) 100%);
}
.detail-hero > .container { position: relative; z-index: 1; }
.detail-hero .lead { margin: 1.3rem 0 2rem; }
.pricebox {
  display: inline-block; background: var(--panel); border: 1px solid var(--neon-line);
  box-shadow: var(--glow); padding: 1.3rem 1.6rem; margin: 0.6rem 0 1.8rem;
}
.pricebox .cart__price { margin-top: 0; font-size: 1.3rem; }
.pricebox .cart__price small { color: var(--dim); max-width: 46ch; }
.pricebox p { color: var(--ink); }
.checklist { list-style: none; display: grid; gap: 0.7rem; margin: 1.6rem 0 2rem; max-width: 52ch; }
.checklist li { padding-left: 1.8em; position: relative; font-weight: 500; font-size: 1.02rem; color: var(--ink); }
.checklist li::before { content: "✓"; position: absolute; left: 0; font-weight: 900; color: var(--neon); text-shadow: 0 0 8px rgba(184,255,0,0.5); }
.backlink { font-family: var(--font-mono); font-size: 0.8rem; letter-spacing: 0.14em; text-decoration: none; color: var(--neon); }
.backlink:hover { text-shadow: 0 0 10px rgba(184,255,0,0.6); }

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; transition: none; }
  .marquee__track { animation: none !important; transform: none !important; }
  .logo__coin, .hero__scrollcue i, .btn__blink, .crt__cursor { animation: none !important; }
  .crt { opacity: 1; transform: none; }
  .hero--pin { position: relative; top: auto; min-height: 0; }
  .stack .cart { position: relative; top: auto; }
  .rain { display: none; }
}

/* ============================================================
   THE HELPER BOT — friendly robot; its face screen plays the demo
   ============================================================ */
.bot {
  position: relative;
  display: flex; flex-direction: column; align-items: center;
  animation: botBob 5.2s ease-in-out infinite;
  filter: drop-shadow(0 30px 40px rgba(0, 0, 0, 0.6));
}
@keyframes botBob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }

.bot__antenna {
  width: 3px; height: 34px;
  background: linear-gradient(to top, var(--neon-line), rgba(184,255,0,0.15));
  position: relative; z-index: 1;
}
.bot__antenna i {
  position: absolute; top: -12px; left: 50%; transform: translateX(-50%);
  width: 12px; height: 12px; border-radius: 50%;
  background: var(--neon);
  box-shadow: 0 0 16px rgba(184,255,0,0.9);
  animation: antennaPulse 2.2s ease-in-out infinite;
}
@keyframes antennaPulse {
  0%,100% { box-shadow: 0 0 10px rgba(184,255,0,0.5); opacity: 0.75; }
  50% { box-shadow: 0 0 26px rgba(184,255,0,1); opacity: 1; }
}

.bot__head {
  position: relative;
  width: 100%;
  background: linear-gradient(180deg, #101614 0%, #0A100E 100%);
  border: 1px solid var(--neon-line);
  border-radius: 26px;
  padding: 14px;
  box-shadow: var(--glow), 0 18px 44px rgba(0,0,0,0.55);
}
.bot__ear {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 10px; height: 56px;
  background: #0D1412; border: 1px solid var(--neon-line);
  border-radius: 6px;
  box-shadow: 0 0 10px rgba(184,255,0,0.15);
}
.bot__ear--l { left: -11px; }
.bot__ear--r { right: -11px; }

/* the face screen — inherits the .crt terminal, rounded to sit in the head */
.bot__head .crt { border-radius: 14px; }
.bot__head .crt::after { border-radius: 14px; }

.bot__neck {
  width: 44px; height: 14px;
  background: repeating-linear-gradient(0deg, #0D1412 0 3px, #101816 3px 6px);
  border-inline: 1px solid var(--neon-line);
}
.bot__body {
  position: relative;
  width: 62%;
  height: 64px;
  background: linear-gradient(180deg, #101614 0%, #0A100E 100%);
  border: 1px solid var(--neon-line);
  border-radius: 18px;
  box-shadow: var(--glow);
}
.bot__chest {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 26px; height: 26px; border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, rgba(184,255,0,0.9), rgba(184,255,0,0.25) 70%);
  box-shadow: 0 0 18px rgba(184,255,0,0.55), inset 0 0 6px rgba(0,0,0,0.5);
  animation: antennaPulse 3.4s ease-in-out 0.8s infinite;
}
.bot__arm {
  position: absolute; top: 8px;
  width: 12px; height: 52px;
  background: #0D1412; border: 1px solid var(--neon-line);
  border-radius: 8px;
  transform-origin: top center;
}
.bot__arm--l { left: -18px; transform: rotate(8deg); }
.bot__arm--r { right: -18px; animation: botWave 6.5s ease-in-out 2.2s infinite; }
@keyframes botWave {
  0%, 78%, 100% { transform: rotate(-8deg); }
  82% { transform: rotate(-58deg); }
  86% { transform: rotate(-30deg); }
  90% { transform: rotate(-58deg); }
  94% { transform: rotate(-8deg); }
}
.bot__feet { display: flex; gap: 26%; margin-top: 8px; width: 62%; justify-content: center; }
.bot__feet i {
  width: 34px; height: 12px;
  background: #0D1412; border: 1px solid var(--neon-line);
  border-radius: 6px 6px 3px 3px;
  box-shadow: 0 6px 14px rgba(0,0,0,0.5);
}

/* face mode — big friendly eyes + smile drawn on the screen between demo loops */
.crt__face {
  min-height: 11.4em;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1.3em;
}
.crt__eyes { display: flex; gap: 2.6em; }
.crt__eyes i {
  width: 1.6em; height: 1.9em; border-radius: 30%;
  background: var(--neon);
  box-shadow: 0 0 18px rgba(184,255,0,0.7);
  animation: botBlink 3.8s ease-in-out infinite;
}
@keyframes botBlink { 0%, 93%, 100% { transform: scaleY(1); } 96% { transform: scaleY(0.08); } }
.crt__mouth {
  width: 3.4em; height: 1.5em;
  border: 0.28em solid var(--neon);
  border-top: none;
  border-radius: 0 0 3em 3em;
  box-shadow: 0 4px 14px rgba(184,255,0,0.35);
}

@media (prefers-reduced-motion: reduce) {
  .bot, .bot__antenna i, .bot__chest, .bot__arm--r, .crt__eyes i { animation: none !important; }
}

/* ---------- OUR PROMISE (guarantee + 50% vow) — added 2026-07-28 ---------- */
.promise { display: grid; grid-template-columns: repeat(2, 1fr); gap: clamp(1.2rem, 2.5vw, 2rem); }
@media (max-width: 900px) { .promise { grid-template-columns: 1fr; } }