body {
  min-height: 100vh;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  background: #080611;
  color: #f5f3ff;
}

:focus,
:focus-visible {
  outline: none !important;
}

a { color: #c4b5fd; }
a:hover { color: #ddd6fe; }

.bg-white,
.bg-light,
.navbar,
.card {
  background-color: #0d0a16 !important;
  color: #f5f3ff;
}

.navbar,
.card,
.border-bottom,
.border-top {
  border-color: #241a3a !important;
}

.navbar-light .navbar-brand,
.navbar-light .navbar-nav .nav-link,
.card h1,
.card h2,
.card h3,
.card h4,
.card h5,
.card h6 {
  color: #f5f3ff;
}

.text-muted { color: #a9a1c7 !important; }
.text-primary { color: #a78bfa !important; }

.btn-primary {
  color: #fff;
  background-color: #8b5cf6;
  border-color: #8b5cf6;
  box-shadow: 0 0 24px rgba(139, 92, 246, .22);
}
.btn-primary:hover,
.btn-primary:focus {
  background-color: #7c3aed;
  border-color: #7c3aed;
}
.btn-outline-primary {
  color: #c4b5fd;
  border-color: #8b5cf6;
}
.btn-outline-primary:hover,
.btn-outline-primary:focus {
  color: #fff;
  background-color: #8b5cf6;
  border-color: #8b5cf6;
}
.btn-outline-secondary {
  color: #d8b4fe;
  border-color: #49327a;
}
.btn-outline-secondary:hover,
.btn-outline-secondary:focus {
  color: #fff;
  background-color: #49327a;
  border-color: #6d28d9;
}

.form-control {
  background: #11101d;
  color: #f5f3ff;
  border-color: #49327a;
}
.form-control:focus {
  background: #11101d;
  color: #fff;
  border-color: #8b5cf6;
  box-shadow: 0 0 0 .2rem rgba(139, 92, 246, .22);
}
.form-control::placeholder { color: #8f84aa; }

.alert-danger {
  color: #fecaca;
  background-color: #33101a;
  border-color: #7f1d1d;
}

.hero {
  background:
    radial-gradient(circle at top right, rgba(139, 92, 246, .35), transparent 34%),
    radial-gradient(circle at bottom left, rgba(85, 89, 223, .22), transparent 30%),
    #080611;
}
.py-md-6 { padding-top: 5rem; padding-bottom: 5rem; }
.mock-board {
  background: #0d0a16;
  border-radius: 18px;
  padding: 24px;
  border: 1px solid #241a3a;
  box-shadow: 0 0 0 1px rgba(139,92,246,.18), 0 24px 80px rgba(0,0,0,.45) !important;
}
.mock-title { font-weight: 700; font-size: 1.4rem; margin-bottom: 18px; color:#f5f3ff; }
.mock-row { display: grid; grid-template-columns: 1fr 110px 90px; align-items: center; gap: 12px; border-top: 1px solid #241a3a; padding: 14px 0; }
.status { color: #fff; text-align: center; border-radius: 4px; padding: 6px 8px; font-size: .82rem; }
.status.done { background: #00c875; }
.status.working { background: #fdab3d; }
.status.stuck { background: #5559df; }
.mock-row em { color: #a9a1c7; font-style: normal; font-size: .9rem; }

/* Human-first marketing homepage */
.marketing-page {
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #080611;
  color: #f7f5ff;
  overflow-x: hidden;
}
.marketing-page .navbar-brand,
.marketing-page .footer-brand {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  letter-spacing: -.04em;
  color: #f7f5ff !important;
}
.marketing-page .navbar-brand:hover,
.marketing-page .navbar-brand:focus,
.marketing-page .footer-brand:hover,
.marketing-page .footer-brand:focus {
  color: #f7f5ff !important;
  opacity: 1;
  text-decoration: none;
}
.marketing-page .navbar-brand .text-primary,
.marketing-page .footer-brand .text-primary {
  color: #a78bfa !important;
}
.marketing-nav {
  min-height: 68px;
  background: rgba(8, 6, 17, .82) !important;
  border-color: rgba(167, 139, 250, .14) !important;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.marketing-nav .navbar-brand { font-size: 1.12rem; }
.marketing-nav .btn { border-radius: 10px; font-weight: 700; }
.marketing-nav-link { color: #c8c1da !important; text-decoration: none !important; }
.marketing-page .btn-primary {
  background: linear-gradient(135deg, #9a67ff, #7c3aed);
  border-color: #9a67ff;
  box-shadow: 0 12px 35px rgba(124, 58, 237, .3);
}
.marketing-page .btn-primary:hover,
.marketing-page .btn-primary:focus-visible { transform: translateY(-1px); box-shadow: 0 16px 42px rgba(124, 58, 237, .38); }
.marketing-page .btn { transition: transform .18s ease, box-shadow .18s ease, background .18s ease; }

/* Mouse/touch navigation must not briefly show Bootstrap's focus treatment.
   Keep a deliberate indicator for keyboard users. */
.marketing-page :is(a, button):focus:not(:focus-visible) { outline: none; }
.marketing-page .btn:focus:not(:focus-visible) { box-shadow: none; }
.marketing-page :is(a, button):focus-visible { outline: 2px solid #d8b4fe; outline-offset: 3px; }

/* Contact lives here so its layout survives an in-place public-page swap. */
.contact-page { min-height: 100vh; background: #080611; color: #f5f3ff; }
.contact-shell { padding: 76px 0 96px; }
.contact-kicker { color: #c4b5fd; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.contact-title { max-width: 680px; margin: 12px 0 14px; font-size: clamp(38px, 6vw, 64px); font-weight: 800; line-height: 1.02; letter-spacing: -.045em; }
.contact-lead { max-width: 570px; color: #c7c0dc; font-size: 18px; line-height: 1.65; }
.contact-card { margin-top: 36px; padding: 28px; border: 1px solid #32254d; border-radius: 18px; background: #0d0a16; box-shadow: 0 22px 60px rgba(0,0,0,.3); }
.contact-card label { color: #ebe7ff; font-size: 14px; font-weight: 700; }
.contact-card .form-control { min-height: 46px; color: #f5f3ff; background: #11101d; border-color: #49327a; }
.contact-card textarea.form-control { min-height: 156px; resize: vertical; }
.contact-card .form-control:focus { color: #fff; background: #151222; border-color: #a78bfa; box-shadow: 0 0 0 .18rem rgba(139,92,246,.22); }
.contact-card .btn-primary { padding: 11px 18px; background: #8b5cf6; border-color: #8b5cf6; font-weight: 800; }
.contact-card .btn-primary:hover { background: #a78bfa; border-color: #a78bfa; }
.contact-note { color: #a9a1c7; font-size: 13px; line-height: 1.5; }
.contact-visual { position: relative; min-height: 310px; margin-top: 32px; padding: 28px; overflow: hidden; border: 1px solid #342357; border-radius: 22px; background: radial-gradient(circle at 82% 12%, rgba(139,92,246,.37), transparent 36%), linear-gradient(145deg, #17102b, #0b0914 72%); }
.contact-visual::before { content: ''; position: absolute; width: 290px; height: 290px; right: -80px; bottom: -130px; border: 1px solid rgba(196,181,253,.18); border-radius: 50%; box-shadow: 0 0 0 34px rgba(196,181,253,.04), 0 0 0 68px rgba(196,181,253,.025); }
.contact-orb { display: grid; position: relative; z-index: 1; width: 56px; height: 56px; place-items: center; border-radius: 16px; color: #fff; background: linear-gradient(135deg, #a78bfa, #6d28d9); box-shadow: 0 14px 30px rgba(109,40,217,.35); font-size: 25px; }
.contact-visual h2 { position: relative; z-index: 1; margin: 26px 0 10px; font-size: 28px; font-weight: 800; letter-spacing: -.03em; }
.contact-visual p { position: relative; z-index: 1; max-width: 330px; margin: 0; color: #c7c0dc; line-height: 1.6; }
.contact-visual small { display: inline-block; position: relative; z-index: 1; margin-top: 34px; padding: 7px 10px; border: 1px solid rgba(196,181,253,.2); border-radius: 999px; color: #d8d1ee; }
.contact-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
@media (max-width: 991px) { .contact-shell { padding-top: 48px; } .contact-visual { min-height: 260px; } }

.marketing-hero {
  position: relative;
  min-height: 760px;
  padding: 112px 0 104px;
  background: linear-gradient(180deg, #080611 0%, #0b0716 62%, #0d0919 100%);
  overflow: hidden;
}
.marketing-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: linear-gradient(rgba(167,139,250,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(167,139,250,.035) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: linear-gradient(to bottom, black, transparent 78%);
}
.marketing-hero > .container { z-index: 2; }
.hero-grid-comets {
  position: absolute;
  inset: 52px 0 auto;
  z-index: 1;
  display: block;
  pointer-events: none;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.95), rgba(0,0,0,.5) 64%, transparent 92%);
}
.hero-glow { position: absolute; border-radius: 50%; filter: blur(12px); pointer-events: none; }
.hero-glow-one { width: 620px; height: 620px; right: -180px; top: -220px; background: radial-gradient(circle, rgba(124,58,237,.32), transparent 68%); }
.hero-glow-two { width: 500px; height: 500px; left: -300px; bottom: -260px; background: radial-gradient(circle, rgba(69,96,255,.18), transparent 70%); }
.hero-copy { position: relative; z-index: 2; }
.hero-kicker {
  display: inline-flex; align-items: center; gap: 9px;
  color: #d8ccff; background: rgba(139,92,246,.1); border: 1px solid rgba(167,139,250,.24);
  border-radius: 999px; padding: 8px 13px; font-size: .82rem; font-weight: 750; letter-spacing: .01em;
}
.hero-kicker-spark { color: #a78bfa; font-size: 1rem; }
.marketing-hero h1 {
  max-width: 680px; margin: 25px 0 20px; color: #faf8ff;
  font-size: clamp(3rem, 5vw, 5rem); line-height: .99; letter-spacing: -.065em; font-weight: 800;
}
.hero-lead { max-width: 650px; color: #bbb3d0; font-size: 1.18rem; line-height: 1.68; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 31px; }
.hero-actions .btn { border-radius: 12px; padding: .82rem 1.25rem; font-weight: 750; }
.hero-actions .btn span, .final-cta .btn span { margin-left: 7px; }
.hero-install { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 15px; color: #847b98; font-size: .73rem; }
.hero-install[hidden] { display: none !important; }
.install-mac-button {
  appearance: none;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 11px;
  color: #d9ceef;
  background: rgba(255,255,255,.025);
  border: 1px solid rgba(167,139,250,.25);
  border-radius: 9px;
  font: inherit;
  font-weight: 750;
  cursor: pointer;
  transition: color .18s ease, border-color .18s ease, background .18s ease;
}
.install-mac-button:hover,
.install-mac-button:focus-visible { color: #fff; border-color: rgba(167,139,250,.55); background: rgba(139,92,246,.1); outline: none; }
.install-guide {
  width: min(430px, calc(100vw - 32px));
  padding: 30px;
  color: #f7f5ff;
  background: #100b1b;
  border: 1px solid rgba(167,139,250,.34);
  border-radius: 18px;
  box-shadow: 0 30px 100px rgba(0,0,0,.7), 0 0 60px rgba(124,58,237,.12);
}
.install-guide::backdrop { background: rgba(5,3,10,.72); backdrop-filter: blur(6px); }
.install-guide h2 { margin: 13px 0 10px; font-size: 1.35rem; letter-spacing: -.03em; }
.install-guide p { margin: 0 0 22px; color: #bdb5cc; line-height: 1.65; }
.install-guide-icon { width: 40px; height: 40px; display: grid; place-items: center; color: #e7ddff; background: #6d3ad4; border-radius: 11px; font-size: 1.25rem; }
.install-guide-close { position: absolute; top: 12px; right: 14px; padding: 5px 8px; color: #968ca7; background: transparent; border: 0; font-size: 1.4rem; cursor: pointer; }
.install-guide-close:hover,
.install-guide-close:focus-visible { color: #fff; outline: none; }
.hero-reassurance { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 26px; color: #8f87a5; font-size: .78rem; }
.hero-reassurance b { color: #8bdaae; margin-right: 4px; }

.product-preview {
  position: relative; z-index: 2; width: 620px; margin-left: 0;
  background: #0d0a17; border: 1px solid rgba(167,139,250,.24); border-radius: 20px;
  box-shadow: 0 40px 100px rgba(0,0,0,.55), 0 0 80px rgba(124,58,237,.12);
  overflow: hidden; transform: perspective(1300px) rotateY(-2deg) rotateX(1deg);
}
.preview-topbar { height: 47px; display: flex; align-items: center; justify-content: space-between; padding: 0 16px; border-bottom: 1px solid #251b39; color: #bdb5d1; font-size: .74rem; font-weight: 700; }
.preview-dots { display: flex; gap: 5px; }
.preview-dots i { width: 7px; height: 7px; border-radius: 50%; background: #443755; }
.preview-dots i:nth-child(2) { background: #7052a5; }
.preview-workspace { display: grid; grid-template-columns: minmax(0, 1fr) 220px; min-height: 430px; }
.preview-board { padding: 25px 23px; border-right: 1px solid #251b39; background: linear-gradient(145deg, rgba(255,255,255,.012), transparent); }
.preview-board-heading { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 24px; }
.preview-board-heading small { display: block; margin-bottom: 5px; color: #746a8b; font-size: .56rem; letter-spacing: .13em; font-weight: 800; }
.preview-board-heading strong { display: block; font-size: 1.22rem; letter-spacing: -.03em; }
.preview-board-heading span { color: #827893; font-size: .65rem; }
.preview-group { margin-bottom: 22px; }
.preview-group-title { display: flex; align-items: center; gap: 7px; color: #c9c2d8; font-size: .69rem; font-weight: 800; padding-bottom: 8px; }
.preview-group-title i { width: 7px; height: 7px; border-radius: 50%; background: #9b6cff; box-shadow: 0 0 10px rgba(155,108,255,.55); }
.preview-group-later .preview-group-title i { background: #4c5269; box-shadow: none; }
.preview-task { min-height: 48px; display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; align-items: center; gap: 9px; margin-bottom: 6px; padding: 8px 10px; background: #13101f; border: 1px solid #231b34; border-radius: 9px; }
.preview-task strong { font-size: .71rem; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.preview-task em { color: #817991; font-style: normal; font-size: .58rem; }
.task-check { width: 17px; height: 17px; border: 1px solid #4a405d; border-radius: 5px; display: grid; place-items: center; color: #09110d; font-size: .65rem; }
.task-check.complete { background: #55d792; border-color: #55d792; }
.tag { min-width: 44px; padding: 4px 6px; border-radius: 5px; color: #fff !important; text-align: center; font-size: .53rem !important; font-weight: 800; }
.tag-done { background: #20895b; }
.tag-today { background: #ad6a22; }
.tag-focus { background: #7040bf; }
.preview-agent { position: relative; padding: 17px 14px; background: #0a0712; }
.preview-agent-head { display: flex; align-items: center; gap: 7px; padding-bottom: 14px; border-bottom: 1px solid #251b39; font-size: .7rem; }
.preview-agent-head span { color: #9b6cff; }
.preview-agent-head i { margin-left: auto; width: 6px; height: 6px; border-radius: 50%; background: #42cf84; box-shadow: 0 0 8px rgba(66,207,132,.6); }
.agent-message, .agent-reply { margin-top: 14px; padding: 10px; border: 1px solid #2a2040; border-radius: 10px 10px 10px 3px; color: #d5cee1; font-size: .63rem; line-height: 1.55; }
.agent-summary { display: flex; align-items: center; gap: 8px; margin: 9px 0; padding: 8px; background: #12101b; border-radius: 8px; }
.agent-summary > span { width: 19px; height: 19px; display: grid; place-items: center; border-radius: 5px; background: rgba(139,92,246,.17); color: #b99cff; font-size: .58rem; font-weight: 800; }
.agent-summary p { margin: 0; min-width: 0; }
.agent-summary strong, .agent-summary small { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.agent-summary strong { font-size: .6rem; }
.agent-summary small { color: #817991; font-size: .52rem; margin-top: 2px; }
.agent-question { width: 84%; margin: 13px 0 0 auto; padding: 9px; background: linear-gradient(135deg, #8b5cf6, #6d3ed4); border-radius: 10px 10px 3px 10px; font-size: .59rem; line-height: 1.4; }
.agent-reply { margin-top: 8px; }
.agent-input { position: absolute; left: 14px; right: 14px; bottom: 15px; display: flex; align-items: center; justify-content: space-between; padding: 8px 8px 8px 10px; border: 1px solid #4d347f; border-radius: 9px; color: #766d87; font-size: .56rem; }
.agent-input b { width: 23px; height: 23px; display: grid; place-items: center; border-radius: 6px; background: #6f3fc5; color: #fff; }

.human-proof { padding: 27px 0 29px; background: #0d0917; border-top: 1px solid #1f1730; border-bottom: 1px solid #1f1730; text-align: center; }
.human-proof p { margin: 0 0 14px; color: #6f6781; font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .14em; }
.proof-list { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 11px; }
.proof-list span { padding: 7px 12px; border-radius: 999px; background: #141020; border: 1px solid #292039; color: #b9b1c9; font-size: .76rem; }

.benefits-section { padding: 105px 0 88px; background: #0a0713; }
.section-heading { max-width: 730px; margin: 0 auto 55px; text-align: center; }
.section-eyebrow { color: #a78bfa; font-size: .7rem; line-height: 1.4; font-weight: 850; letter-spacing: .14em; }
.section-heading h2, .agent-feature h2, .connect-card h2, .final-cta h2 { color: #f7f4ff; font-weight: 800; letter-spacing: -.045em; }
.section-heading h2 { margin: 13px 0 16px; font-size: clamp(2.2rem, 4vw, 3.4rem); }
.section-heading p { color: #a9a1bb; font-size: 1.05rem; line-height: 1.65; }
.benefit-card { height: 100%; padding: 29px; border: 1px solid #251d35; border-radius: 18px; background: linear-gradient(155deg, #12101c, #0e0b17); transition: transform .2s ease, border-color .2s ease; }
.benefit-card:hover { transform: translateY(-4px); border-color: #49356d; }
.benefit-card-agent { background: linear-gradient(155deg, rgba(96,54,173,.24), #100c1b 72%); border-color: #3b285d; }
.benefit-icon { width: 46px; height: 46px; display: grid; place-items: center; margin-bottom: 25px; border-radius: 13px; background: #1b1529; color: #ab8cff; }
.icon-agent { font-size: 1.35rem; box-shadow: inset 0 0 24px rgba(139,92,246,.15); }
.icon-board { display: flex; flex-direction: column; justify-content: center; align-items: stretch; gap: 4px; padding: 11px; }
.icon-board i { height: 5px; border-radius: 3px; background: #a78bfa; }
.icon-board i:nth-child(2) { width: 70%; background: #7250b0; }
.icon-board i:nth-child(3) { width: 86%; background: #59417c; }
.icon-update i { width: 22px; height: 22px; display: grid; place-items: center; border: 2px solid #8bdaae; border-radius: 50%; color: #8bdaae; font-style: normal; font-size: .75rem; }
.benefit-card h3 { margin-bottom: 12px; font-size: 1.18rem; font-weight: 750; letter-spacing: -.025em; }
.benefit-card p { min-height: 96px; color: #a9a1bb; font-size: .92rem; line-height: 1.65; }
.benefit-card > span { display: block; padding-top: 17px; border-top: 1px solid #261e36; color: #81798f; font-size: .72rem; line-height: 1.5; }

.agent-section { padding: 40px 0 110px; background: #0a0713; }
.agent-feature { display: grid; grid-template-columns: 1fr .88fr; gap: 80px; align-items: center; padding: 65px; border: 1px solid #34234e; border-radius: 28px; background: radial-gradient(circle at 12% 0, rgba(115,65,197,.25), transparent 42%), #0e0a18; box-shadow: 0 35px 100px rgba(0,0,0,.3); }
.agent-orb { width: 52px; height: 52px; display: grid; place-items: center; margin-bottom: 25px; border-radius: 16px; color: #efe9ff; background: linear-gradient(145deg, #a06eff, #6937c2); box-shadow: 0 12px 40px rgba(124,58,237,.35); font-size: 1.45rem; }
.agent-feature h2 { margin: 13px 0 17px; font-size: clamp(2.15rem, 3.5vw, 3.35rem); }
.agent-feature-copy > p { color: #ada5bc; line-height: 1.7; }
.agent-feature ul { margin: 29px 0 0; padding: 0; list-style: none; }
.agent-feature li { display: flex; gap: 13px; align-items: flex-start; margin-top: 19px; }
.agent-feature li > span { color: #9b6cff; margin-top: 2px; }
.agent-feature li strong, .agent-feature li small { display: block; }
.agent-feature li strong { font-size: .92rem; }
.agent-feature li small { margin-top: 4px; color: #81798f; font-size: .78rem; }
.agent-conversation { padding: 21px; border: 1px solid #372653; border-radius: 18px; background: #080611; box-shadow: 0 25px 70px rgba(0,0,0,.35); }
.conversation-head { display: flex; justify-content: space-between; align-items: center; padding: 0 2px 17px; border-bottom: 1px solid #261b39; }
.conversation-head span { color: #e8e1f7; font-weight: 800; }
.conversation-head span::first-letter { color: #a78bfa; }
.conversation-head small { color: #726a81; font-size: .66rem; }
.bubble { max-width: 88%; margin-top: 16px; padding: 12px 14px; border-radius: 13px; font-size: .79rem; line-height: 1.6; }
.bubble-user { margin-left: auto; color: white; background: linear-gradient(135deg, #8b5cf6, #6d3ec9); border-bottom-right-radius: 4px; }
.bubble-agent { color: #d4cde0; background: #15101f; border: 1px solid #2a203b; border-bottom-left-radius: 4px; }
.bubble-agent b { color: #f3effa; }
.done-mark { display: inline-grid; place-items: center; width: 19px; height: 19px; margin-right: 5px; border-radius: 50%; background: #2d8e62; color: #fff; font-size: .68rem; }

.connect-section { padding: 30px 0 95px; background: #0a0713; }
.connect-card { display: flex; align-items: center; justify-content: space-between; gap: 40px; padding: 42px 48px; border: 1px solid #282034; border-radius: 20px; background: #0e0b17; }
.connect-card > div:first-child { max-width: 690px; }
.connect-card h2 { margin: 10px 0 10px; font-size: 1.75rem; }
.connect-card p { margin: 0; color: #958da5; line-height: 1.65; }
.connect-pills { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.connect-pills span { padding: 9px 12px; border: 1px solid #3b2d50; border-radius: 9px; color: #c8bfda; background: #161020; font-family: ui-monospace, monospace; font-size: .73rem; }

.final-cta { position: relative; padding: 110px 0; background: radial-gradient(circle at 50% 100%, rgba(124,58,237,.28), transparent 48%), #0d0918; border-top: 1px solid #20172f; }
.final-cta .container { max-width: 750px; }
.final-spark { width: 49px; height: 49px; display: grid; place-items: center; margin: 0 auto 23px; border-radius: 50%; background: rgba(139,92,246,.14); border: 1px solid rgba(167,139,250,.35); color: #aa8cff; }
.final-cta h2 { font-size: clamp(2.25rem, 4vw, 3.5rem); }
.final-cta p { margin: 17px 0 28px; color: #aaa2b9; font-size: 1.04rem; }
.final-cta .btn { border-radius: 12px; padding: .86rem 1.3rem; font-weight: 750; }
.final-cta small { display: block; margin-top: 17px; color: #777083; }
.marketing-footer { padding: 28px 0; background: #080611; border-color: #21182f !important; color: #777083; }
.footer-brand { color: #eeeafa; font-weight: 800; text-decoration: none !important; }
.footer-brand span { color: #a78bfa; }
.marketing-footer small { font-size: .72rem; }

@media (max-width: 1199.98px) {
  .product-preview { width: 500px; transform: none; }
  .preview-workspace { grid-template-columns: minmax(0, 1fr) 190px; }
}
@media (max-width: 991.98px) {
  .marketing-hero { padding: 88px 0 82px; }
  .hero-copy { text-align: center; }
  .hero-kicker { margin: 0 auto; }
  .hero-lead { margin-left: auto; margin-right: auto; }
  .hero-actions, .hero-reassurance { justify-content: center; }
  .product-preview { width: 100%; max-width: 720px; margin: 45px auto 0; }
  .preview-workspace { grid-template-columns: minmax(0, 1fr) 225px; }
  .agent-feature { grid-template-columns: 1fr; gap: 45px; padding: 50px; }
  .connect-card { align-items: flex-start; flex-direction: column; }
  .connect-pills { justify-content: flex-start; }
}
@media (max-width: 767.98px) {
  .marketing-nav { min-height: 62px; }
  .marketing-nav .container { padding-left: 16px; padding-right: 16px; }
  .marketing-nav .navbar-brand { font-size: .96rem; }
  .marketing-nav .btn { font-size: .78rem; padding: .48rem .72rem; }
  .marketing-hero { min-height: auto; padding: 68px 0 70px; }
  .marketing-hero h1 { font-size: 3rem; }
  .hero-lead { font-size: 1.02rem; line-height: 1.6; }
  .hero-actions .btn { width: 100%; margin: 0; }
  .hero-reassurance { gap: 8px 15px; }
  .preview-workspace { grid-template-columns: minmax(0, 1fr); }
  .preview-board { border-right: 0; }
  .preview-agent { min-height: 360px; border-top: 1px solid #251b39; }
  .human-proof { padding-left: 8px; padding-right: 8px; }
  .benefits-section { padding: 78px 0 62px; }
  .section-heading { margin-bottom: 38px; }
  .benefit-card p { min-height: 0; }
  .agent-section { padding-bottom: 80px; }
  .agent-feature { padding: 30px 22px; border-radius: 20px; }
  .connect-section { padding-bottom: 70px; }
  .connect-card { padding: 30px 24px; }
  .final-cta { padding: 82px 0; }
  .marketing-footer .container { gap: 8px; }
}
@media (max-width: 430px) {
  .marketing-hero h1 { font-size: 2.65rem; }
  .hero-reassurance { flex-direction: column; align-items: center; }
  .product-preview { border-radius: 14px; }
  .preview-board { padding: 20px 14px; }
  .preview-task { padding-left: 7px; padding-right: 7px; }
  .preview-board-heading strong { font-size: 1.05rem; }
  .preview-agent { padding: 16px 13px; }
  .proof-list { gap: 7px; }
  .proof-list span { font-size: .67rem; }
  .benefit-card { padding: 24px; }
  .conversation-head { align-items: flex-start; flex-direction: column; gap: 5px; }
}
@media (prefers-reduced-motion: reduce) {
  .marketing-page .btn, .benefit-card { transition: none; }
}

/* Ambient motion never controls content visibility or page layout. */
.hero-glow {
  --glow-scroll-y: 0px;
  transform: translate3d(0, var(--glow-scroll-y), 0);
  transition: transform .45s cubic-bezier(.22, 1, .36, 1);
  will-change: transform;
}
.magnetic-button {
  --magnetic-x: 0px;
  --magnetic-y: 0px;
  translate: var(--magnetic-x) var(--magnetic-y);
  transition: translate .22s cubic-bezier(.22, 1, .36, 1), transform .18s ease, box-shadow .18s ease, background .18s ease !important;
}
@media (hover: none), (pointer: coarse) {
  .hero-glow { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-glow,
  .magnetic-button { transform: none; translate: none; transition: none !important; }
}
