/* Rocket AI brand v2 — Void Black / Pure White / Orbital Purple */
:root {
  --c-bg: #ffffff;
  --c-bg-soft: #f6f5f8;
  --c-bg-tint: #f3efff;
  --c-surface: #ffffff;
  --c-ink: #0a0a0d;
  --c-ink-2: #29272f;
  --c-muted: #68636f;
  --c-muted-2: #8f8998;
  --c-line: #e4e1e8;
  --c-line-strong: #cbc6d0;
  --c-brand: #885cf6;
  --c-brand-2: #9c78f8;
  --c-brand-deep: #6035c8;
  --c-brand-soft: #eee7ff;
  --c-brand-tint: #f8f5ff;
  --c-accent: #6035c8;
  --c-accent-2: #885cf6;
  --c-accent-soft: #eee7ff;
  --sh-brand: 0 12px 30px rgba(136, 92, 246, .28);
}

body { background: #fff; }

.announce { background: #0a0a0d; border-bottom-color: #28252e; }
.announce__dot { background: #885cf6; box-shadow: 0 0 0 4px rgba(136,92,246,.15), 0 0 18px rgba(136,92,246,.55); }

.brand-logo { width: 164px; height: auto; object-fit: contain; }
.footer .brand-logo { width: 138px; filter: invert(1); }

.hero {
  background:
    radial-gradient(760px 500px at 78% 28%, rgba(136,92,246,.25), transparent 64%),
    linear-gradient(135deg, #0a0a0d 0%, #111016 52%, #171221 100%);
}
.hero::before {
  opacity: .17;
  background-image:
    linear-gradient(rgba(136,92,246,.24) 1px, transparent 1px),
    linear-gradient(90deg, rgba(136,92,246,.24) 1px, transparent 1px);
}
.hero::after { background: linear-gradient(to bottom, transparent, #fff); }
.hero h1 em { background: linear-gradient(100deg, #ffffff 0%, #bba4ff 44%, #885cf6 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero__lead { color: #c8c4ce; }
.hero__promise {
  max-width: 49ch;
  margin: 18px 0 0;
  padding-left: 16px;
  border-left: 2px solid #885cf6;
  color: #d9d5df;
}
.hero__promise strong { color: #fff; }
.hero__fact { color: #f0edf4; background: rgba(255,255,255,.055); border-color: rgba(255,255,255,.15); }
.hero__fact svg { color: #a888fa; }
.hero .btn-primary,
.offer .btn-primary,
.finalcta .btn-primary {
  color: #fff;
  background: #885cf6;
  box-shadow: 0 14px 38px rgba(136,92,246,.34);
}
.hero .btn-primary:hover,
.offer .btn-primary:hover,
.finalcta .btn-primary:hover { background: #9a73f8; box-shadow: 0 18px 48px rgba(136,92,246,.46); }

.hero__panel { background: rgba(10,10,13,.82); border-color: rgba(255,255,255,.18); }
.hero__panel::before { background: linear-gradient(135deg, rgba(136,92,246,.15), transparent 55%); }
.agent-system { background: radial-gradient(circle at 50% 51%, rgba(136,92,246,.25), transparent 38%), #0a0a0d; border-color: rgba(136,92,246,.25); }
.agent-system__grid { background-image: linear-gradient(rgba(136,92,246,.22) 1px, transparent 1px), linear-gradient(90deg, rgba(136,92,246,.22) 1px, transparent 1px); }
.agent-system__status { color: #cbbcff; border-color: rgba(136,92,246,.3); background: rgba(136,92,246,.10); }
.agent-system__status i { background: #885cf6; box-shadow: 0 0 12px #885cf6; }
.agent-system__orbit { border-color: rgba(187,164,255,.26); }
.agent-system__core { background: linear-gradient(145deg, rgba(136,92,246,.75), rgba(47,31,84,.72)); border-color: rgba(222,211,255,.42); box-shadow: 0 0 54px rgba(136,92,246,.38); }
.agent-system__core-mark { background: #fff; color: #0a0a0d; }
.agent-system__node { color: #f4f0ff; background: rgba(20,17,27,.92); border-color: rgba(136,92,246,.3); }
.agent-system__node svg { color: #a888fa; }
.hero__session-no { color: #d9ceff; background: rgba(136,92,246,.2); }
.hero__panel .badge--accent { color: #e4dbff; background: rgba(136,92,246,.17); }
.demo-flag { color: #d9ceff; background: rgba(136,92,246,.14); }
.demo-flag i { background: #885cf6; box-shadow: 0 0 12px rgba(136,92,246,.72); }

.list-check li::before {
  color: #6035c8;
  background: #eee7ff;
}

.section:nth-of-type(odd)::before { background: radial-gradient(circle, rgba(136,92,246,.07), transparent 68%); }
.eyebrow { color: #6035c8; border-color: rgba(136,92,246,.2); background: rgba(136,92,246,.07); }
.eyebrow::before { background: #885cf6; }
.whynow__quote { border-color: rgba(136,92,246,.2); border-left-color: #885cf6; background: linear-gradient(100deg, #f2edff, #fff); }
.whynow__step--active { background: #885cf6; box-shadow: var(--sh-brand); }
.problem__card::before { background: #885cf6; }
.problem__closing { background: #f3efff; }
.ladder__row--last { background: #f3efff; border-color: #885cf6; }
.session__head,
.session:nth-child(2) .session__head,
.session:nth-child(3) .session__head { background: #f3efff; }
.session__no { background: #885cf6; }

#demo-trong-zoom,
#hoat-dong,
#ket-qua {
  color: #c9c5ce;
  background: radial-gradient(680px 420px at 12% 8%, rgba(136,92,246,.18), transparent 70%), #0a0a0d;
}
#demo-trong-zoom h2, #demo-trong-zoom h3, #demo-trong-zoom strong,
#hoat-dong h2, #hoat-dong h3,
#ket-qua h2, #ket-qua h3 { color: #fff; }
#demo-trong-zoom .section-head p, #hoat-dong .section-head p, #ket-qua .section-head p { color: #aaa4b2; }
#demo-trong-zoom .eyebrow, #hoat-dong .eyebrow, #ket-qua .eyebrow { color: #c6b5ff; border-color: rgba(136,92,246,.3); background: rgba(136,92,246,.12); }
#demo-trong-zoom .agent { background: rgba(255,255,255,.055); border-color: rgba(136,92,246,.28); }
#demo-trong-zoom .agent p { color: #bbb5c3; }
#demo-trong-zoom .agent__name { color: #bda8ff; }

.activity-grid { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 240px; gap: 14px; }
.activity-card { position: relative; overflow: hidden; margin: 0; border: 1px solid #2d2933; border-radius: 18px; background: #151419; }
.activity-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .28s ease-out; }
.activity-card::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(10,10,13,.42), transparent 45%); pointer-events: none; }
@media (hover:hover) { .activity-card:hover img { transform: scale(1.025); } }

.video-proof { overflow: hidden; border: 1px solid #343039; border-radius: 18px; background: #151419; }
.video-proof__frame { position: relative; overflow: hidden; aspect-ratio: 16/9; background: #050506; }
.video-proof__frame img { width: 100%; height: 100%; object-fit: cover; display: block; }
.video-proof iframe,
.video-proof video { width: 100%; height: 100%; border: 0; display: block; }
.video-proof video { object-fit: contain; background: #050506; }
.video-proof__play {
  position: absolute; inset: 0; margin: auto;
  width: 60px; height: 60px; border-radius: 50%;
  border: none; cursor: pointer; padding: 0;
  background: rgba(10, 10, 13, .55);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  z-index: 1;
  touch-action: manipulation;
  transition: background .2s ease, transform .2s ease;
}
.video-proof__play svg { width: 24px; height: 24px; margin-left: 3px; }
.video-proof__play:hover { background: rgba(136, 92, 246, .85); transform: scale(1.08); }
.video-proof__play:focus-visible { outline: 3px solid #fff; outline-offset: 4px; }
.video-proof__meta { padding: 16px 18px 18px; }
.video-proof__meta b { color: #fff; display: block; }
.video-proof__meta span { color: #aaa4b2; font-size: 13px; }

.commitment-intro { max-width: 760px; margin-bottom: 24px; }
.commitment-intro h3 { margin-bottom: 8px; }
.commitment-grid { gap: 14px; }
.commitment-item {
  min-height: 96px;
  display: flex;
  align-items: center;
  padding: 22px;
  border: 1px solid #ddd6eb;
  border-radius: 16px;
  background: linear-gradient(145deg, #fff, #f8f5ff);
}
.commitment-item::before {
  content: '';
  flex: 0 0 10px;
  width: 10px;
  height: 10px;
  margin-right: 12px;
  border-radius: 50%;
  background: #885cf6;
  box-shadow: 0 0 0 5px rgba(136,92,246,.12);
}
.fee-heading { margin-top: 70px; }
.fee-heading + .fee__points { max-width: 920px; }

.gift-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
  max-width: 620px;
  margin-inline: auto;
  padding: clamp(28px, 5vw, 48px);
  border: 1px solid #cdbfff;
  border-radius: 24px;
  background: linear-gradient(135deg, #fff 0%, #f3efff 100%);
  box-shadow: 0 22px 60px rgba(96,53,200,.12);
}
.gift-card .gain__icon { width: 58px; height: 58px; background: #fff; }
.gift-card h2 { margin: 12px 0 10px; }

.offer { background: radial-gradient(620px 380px at 82% 16%, rgba(136,92,246,.28), transparent 66%), #0a0a0d; }
.offer__card { border-color: rgba(136,92,246,.3); }
.finalcta { background: radial-gradient(620px 320px at 50% 0%, rgba(136,92,246,.24), transparent 68%), #0a0a0d; }
.finalcta__benefits { max-width: 520px; margin: 24px auto; text-align: left; color: #d8d3dd; }
.finalcta__benefits li::before { background: rgba(136,92,246,.18); color: #c8b8ff; }
.finalcta__lead strong { color: #fff; }
.finalcta__guarantee {
  max-width: 860px;
  margin: 32px auto;
  display: grid;
  grid-template-columns: minmax(180px, 224px) minmax(0, 1fr);
  align-items: center;
  gap: clamp(24px, 4vw, 40px);
  text-align: left;
}
.finalcta__guarantee p { margin: 10px 0 0; }
.guarantee { background: #f3efff; border-color: #cbb9ff; }
.guarantee__badge { color: #6035c8; }
.guarantee p { color: #4b3c68; }
.guarantee__visual {
  overflow: hidden;
  width: 100%;
  aspect-ratio: 1;
  border: 1px solid rgba(136,92,246,.24);
  border-radius: 20px;
  background: #05050d;
  box-shadow: 0 18px 42px rgba(35,20,70,.2);
}
.guarantee__visual img { width: 100%; height: 100%; display: block; object-fit: cover; }
.guarantee__content { min-width: 0; }

@media (max-width: 900px) {
  .activity-grid { grid-template-columns: 1fr 1fr; grid-auto-rows: 210px; }
}
@media (max-width: 620px) {
  .brand-logo { width: 146px; }
  .activity-grid { grid-template-columns: 1fr; grid-auto-rows: 220px; }
  .fee-heading { margin-top: 52px; }
  .finalcta__guarantee { grid-template-columns: 1fr; gap: 20px; padding: 22px; }
  .guarantee__visual { width: min(100%, 240px); margin: 0 auto; }
  .guarantee__content { text-align: left; }
}