:root {
  --ink: #101120;
  --muted: #67677d;
  --purple: #7138ff;
  --purple-soft: #f2edff;
  --line: #e9e7f2;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body.landing-page { color: var(--ink); background: #fff; font-family: "Poppins", Arial, sans-serif; font-size: 14px; line-height: 1.45; overflow-x: hidden; }
.landing-page a { color: inherit; text-decoration: none; }
.landing-page svg { display: block; }
.landing-shell { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }

.landing-header { height: 72px; background: rgba(255,255,255,.9); position: relative; z-index: 20; }
.header-inner { height: 100%; display: flex; align-items: center; }
.landing-brand { display: inline-flex; align-items: center; gap: 10px; font-size: 23px; font-weight: 600; letter-spacing: 0; }
.brand-mark { width: 40px; height: 40px; display: grid; place-items: center; color: #fff; border-radius: 50%; background: radial-gradient(circle at 65% 32%, #bfc5ff 0 7%, #6335d8 30%, #24165f 66%, #9c80ff 71%, #f2efff 76%); box-shadow: inset 0 0 9px rgba(255,255,255,.65), 0 7px 18px rgba(72,39,181,.16); transform: rotate(-18deg); }
.brand-mark svg { width: 22px; height: 22px; }
.desktop-nav { display: flex; align-items: center; justify-content: center; gap: 46px; margin: 0 auto; font-size: 11px; font-weight: 500; color: #4d4d63; }
.desktop-nav a, .footer-main nav a { transition: color .2s; }
.desktop-nav a:hover, .footer-main nav a:hover { color: var(--purple); }
.pill-button { min-height: 48px; padding: 0 23px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; gap: 24px; font-size: 12px; font-weight: 500; border: 1px solid transparent; white-space: nowrap; transition: transform .2s, box-shadow .2s, border-color .2s; }
.pill-button:hover { transform: translateY(-2px); }
.pill-button svg { width: 16px; height: 16px; }
.pill-button-dark { color: #fff !important; background: #0d0e17; box-shadow: 0 12px 25px rgba(12,13,23,.15); }
.pill-button-light { border-color: #bbb9ca; background: rgba(255,255,255,.72); }
.header-cta { min-height: 43px; padding-inline: 22px; gap: 22px; }
.mobile-menu { display: none; margin-left: auto; position: relative; }
.mobile-menu summary { list-style: none; width: 42px; height: 42px; display: grid; place-content: center; gap: 5px; cursor: pointer; }
.mobile-menu summary::-webkit-details-marker { display: none; }
.mobile-menu summary span { width: 21px; height: 2px; background: var(--ink); }
.mobile-menu nav { position: absolute; right: 0; top: 50px; width: 220px; padding: 14px; display: grid; gap: 2px; background: #fff; border: 1px solid var(--line); box-shadow: 0 18px 50px rgba(25,19,66,.15); border-radius: 8px; }
.mobile-menu nav a { padding: 10px 12px; border-radius: 6px; }
.mobile-menu nav a:hover { background: var(--purple-soft); }

.hero { min-height: 545px; position: relative; overflow: hidden; background: linear-gradient(100deg, #fff 0 42%, #fbfaff 68%, #f4f1ff 100%); }
.hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(rgba(115,72,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(115,72,255,.025) 1px, transparent 1px); background-size: 36px 36px; mask-image: linear-gradient(90deg, transparent, #000); }
.hero-halo { position: absolute; width: 620px; height: 620px; right: 3%; top: -88px; border-radius: 50%; background: radial-gradient(circle at 45% 50%, rgba(255,255,255,.85) 0 30%, rgba(134,85,255,.08) 31% 56%, rgba(130,86,255,.03) 57% 67%, transparent 68%); }
.hero-inner { min-height: 545px; position: relative; display: grid; grid-template-columns: 48% 52%; z-index: 2; }
.hero-copy { align-self: center; padding: 36px 0 28px 2px; position: relative; z-index: 4; }
.eyebrow { color: #8b64ff; font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .24em; }
.hero h1 { margin-top: 10px; font-size: 51px; line-height: .99; letter-spacing: 0; font-weight: 600; }
.hero h1 span, .automation-copy h2 span { color: var(--purple); }
.hero-lead { max-width: 500px; margin-top: 19px; color: #4f5065; font-size: 16px; line-height: 1.45; }
.hero-actions { display: flex; gap: 16px; margin-top: 22px; }
.hero-actions .pill-button { min-width: 181px; }
.social-proof { margin-top: 30px; display: flex; align-items: center; gap: 14px; color: #5f6076; font-size: 11px; }
.proof-faces { display: flex; padding-left: 8px; }
.proof-faces span { width: 34px; height: 34px; margin-left: -8px; display: grid; place-items: center; color: #fff; font-size: 8px; font-weight: 600; border: 2px solid #fff; border-radius: 50%; background: linear-gradient(145deg, #66524b, #c88d76); }
.proof-faces span:nth-child(2) { background: linear-gradient(145deg, #241c20, #b48978); }
.proof-faces span:nth-child(3) { background: linear-gradient(145deg, #674136, #ecc7ae); }
.proof-faces span:nth-child(4) { background: linear-gradient(145deg, #151827, #aa6a5a); }
.hero-visual { min-width: 0; position: relative; }
.hero-chameleon { position: absolute; width: 790px; max-width: none; right: -188px; bottom: -30px; filter: drop-shadow(0 30px 25px rgba(28,14,62,.15)); }
.hero-motto { position: absolute; left: 10px; top: 115px; z-index: 3; color: #77728e; text-transform: uppercase; font-size: 9px; line-height: 1.5; letter-spacing: .23em; }
.hero-motto i { display: block; width: 28px; height: 2px; margin: 0 0 12px; background: #895cff; }
.hero-motto i:last-child { margin: 13px 0 0; }

.landing-section { padding: 44px 0; }
.pricing-section { padding-top: 32px; background: linear-gradient(180deg, #fff, #fcfbff 75%, #fff); }
.section-heading { margin-bottom: 24px; }
.split-heading { display: grid; grid-template-columns: 2fr 1fr; align-items: end; gap: 40px; }
.section-heading h2 { margin-top: 7px; font-size: 37px; line-height: 1.05; font-weight: 500; letter-spacing: 0; }
.section-heading > p { padding-bottom: 5px; color: #65667d; font-size: 12px; line-height: 1.45; }
.pricing-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 17px; align-items: stretch; }
.price-card { position: relative; min-height: 335px; padding: 29px 24px 20px; background: linear-gradient(135deg, #fbfaff, #f5f2fd); border: 1px solid #f0edf7; border-radius: 14px; display: flex; flex-direction: column; }
.price-card.featured { border-color: #a883ff; background: linear-gradient(145deg, #fff, #f3eeff); box-shadow: 0 14px 36px rgba(99,49,241,.1); }
.popular-label { position: absolute; height: 25px; left: -1px; right: -1px; top: -25px; border-radius: 14px 14px 0 0; display: grid; place-items: center; color: #fff; background: linear-gradient(90deg, #8250ff, #7134ef); text-transform: uppercase; letter-spacing: .08em; font-size: 8px; font-weight: 600; }
.plan-heading { display: flex; align-items: center; gap: 15px; }
.feature-icon, .step-icon { flex: 0 0 auto; width: 54px; height: 54px; border-radius: 13px; display: grid; place-items: center; color: var(--purple); background: linear-gradient(145deg, #eee6ff, #f7f4ff); box-shadow: inset 0 0 18px rgba(114,53,255,.05); }
.feature-icon svg { width: 29px; height: 29px; }
.plan-heading h3 { font-size: 18px; font-weight: 600; }
.plan-heading p { color: #66667b; font-size: 11px; }
.price { margin: 18px 0 12px; display: flex; align-items: baseline; }
.price small { font-size: 15px; font-weight: 600; margin-right: 6px; }
.price strong { font-size: 29px; line-height: 1; font-weight: 600; }
.price span { font-size: 13px; font-weight: 500; }
.price-card ul { display: grid; gap: 5px; list-style: none; margin-bottom: 18px; color: #4f4f65; font-size: 11px; }
.price-card li { display: flex; align-items: center; gap: 10px; }
.price-card li > span { width: 15px; height: 15px; color: var(--purple); }
.price-card li svg { width: 13px; height: 13px; }
.plan-button { min-height: 40px; margin-top: auto; padding: 0 18px; border: 1px solid #bcb9cc; border-radius: 999px; display: flex; align-items: center; justify-content: center; gap: 58px; font-size: 11px; font-weight: 500; background: rgba(255,255,255,.6); }
.plan-button svg { width: 15px; height: 15px; }
.plan-button.selected { color: #fff; background: #0e0f18; border-color: #0e0f18; }

.process-section { padding-top: 32px; }
.steps { display: flex; align-items: flex-start; justify-content: space-between; list-style: none; padding: 2px 18px 0; }
.steps li { width: 155px; text-align: center; }
.step-icon { width: 61px; height: 61px; margin: 0 auto 15px; }
.step-icon svg { width: 27px; height: 27px; }
.steps b { display: block; font-size: 12px; font-weight: 600; }
.steps p { margin-top: 6px; color: #696a80; font-size: 10.5px; line-height: 1.45; }
.step-arrow { margin-top: 20px; color: #11121b; }
.step-arrow svg { width: 18px; height: 18px; }

.features-section { padding-top: 28px; }
.features-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px 18px; }
.feature-item { min-height: 105px; padding: 14px 18px; display: flex; align-items: center; gap: 16px; border-radius: 12px; background: linear-gradient(135deg, #fbfaff, #f6f3fc); }
.feature-item .feature-icon { width: 54px; height: 54px; }
.feature-item h3 { font-size: 13px; font-weight: 600; }
.feature-item p { margin-top: 4px; color: #6f6f83; font-size: 10.5px; line-height: 1.45; }
.automation { margin-top: 27px; display: grid; grid-template-columns: 35% 39% 26%; min-height: 198px; align-items: stretch; }
.automation-image { position: relative; overflow: hidden; background: #090a13; border-radius: 12px; }
.automation-image > span { position: absolute; z-index: 2; left: 27px; top: 28px; color: #d4d0e2; text-transform: uppercase; letter-spacing: .24em; font-size: 8px; line-height: 1.5; }
.automation-image i { display: block; width: 31px; height: 2px; margin-top: 15px; background: #a36dff; }
.automation-image img { position: absolute; width: 420px; max-width: none; right: -145px; bottom: -72px; }
.automation-copy { align-self: center; padding: 16px 30px; }
.automation-copy h2 { margin: 7px 0 10px; font-size: 27px; line-height: 1.08; font-weight: 500; }
.automation-copy > p:last-child { color: #69697d; font-size: 10px; line-height: 1.55; }
.automation-list { align-self: center; list-style: none; padding: 16px 18px; display: grid; gap: 15px; border-radius: 12px; background: linear-gradient(140deg, #fbfaff, #f5f1ff); font-size: 10px; color: #555568; }
.automation-list li { display: flex; align-items: center; gap: 15px; }
.automation-list svg { width: 20px; height: 20px; color: var(--purple); }

.cta-wrap { padding: 10px 0 24px; }
.final-cta { height: 168px; position: relative; overflow: hidden; display: grid; grid-template-columns: 42% 22% 36%; align-items: center; border-radius: 14px; background: #eeeaff; }
.final-cta::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(249,248,255,.98) 0 44%, rgba(249,248,255,.65) 55%, rgba(69,52,131,.08) 100%); }
.final-cta > img { position: absolute; inset: 0 0 0 auto; width: 64%; height: 100%; object-fit: cover; object-position: 60% 55%; }
.cta-copy, .cta-action, .cta-mantra { position: relative; z-index: 2; }
.cta-copy { padding-left: 40px; }
.cta-copy h2 { margin: 6px 0 7px; font-size: 30px; line-height: 1.03; font-weight: 500; }
.cta-copy > p:last-child { max-width: 400px; color: #66677b; font-size: 9.5px; }
.cta-action { justify-self: center; display: grid; justify-items: center; gap: 8px; }
.cta-action .pill-button { min-height: 43px; }
.cta-action small { font-size: 8px; color: #77768a; }
.cta-mantra { justify-self: end; margin-right: 38px; color: #fff; text-transform: uppercase; letter-spacing: .25em; font-size: 8px; line-height: 1.65; }

.landing-footer { padding-bottom: 20px; }
.footer-main { min-height: 105px; display: grid; grid-template-columns: 220px 1fr 180px; align-items: center; border-bottom: 1px solid var(--line); }
.footer-brand { display: flex; align-items: center; gap: 14px; }
.footer-brand .landing-brand { font-size: 18px; }
.footer-brand .brand-mark { width: 34px; height: 34px; }
.footer-brand p { padding-left: 13px; border-left: 1px solid var(--line); color: #6f6f83; text-transform: uppercase; letter-spacing: .18em; font-size: 7px; line-height: 1.6; }
.footer-main nav { display: flex; justify-content: center; gap: 30px; color: #4e4f62; font-size: 8px; }
.social-links { display: flex; justify-content: flex-end; gap: 21px; }
.social-links a { font-size: 10px; font-weight: 700; }
.footer-bottom { min-height: 45px; display: flex; align-items: end; justify-content: space-between; color: #89899c; font-size: 8px; }
.footer-bottom p:last-child { color: #9e79ff; text-transform: uppercase; letter-spacing: .2em; }
.footer-bottom i { display: inline-block; width: 28px; height: 1px; margin-left: 7px; vertical-align: middle; background: #8e5dff; }

@media (max-width: 1000px) {
  .desktop-nav { gap: 22px; }
  .hero h1 { font-size: 43px; }
  .hero-chameleon { width: 650px; right: -195px; }
  .hero-motto { display: none; }
  .automation { grid-template-columns: 34% 40% 26%; }
  .automation-copy { padding-inline: 20px; }
  .footer-main { grid-template-columns: 190px 1fr 130px; }
  .footer-main nav { gap: 15px; }
}

@media (max-width: 780px) {
  .landing-shell { width: min(100% - 32px, 560px); }
  .desktop-nav, .header-cta { display: none; }
  .mobile-menu { display: block; }
  .hero { min-height: 760px; }
  .hero-inner { min-height: 760px; display: block; }
  .hero-copy { padding-top: 56px; text-align: center; }
  .hero h1 { font-size: 40px; }
  .hero-lead { font-size: 14px; margin-inline: auto; }
  .hero-actions { justify-content: center; }
  .social-proof { justify-content: center; }
  .hero-visual { position: absolute; height: 330px; left: -16px; right: -16px; bottom: 0; }
  .hero-halo { width: 460px; height: 460px; right: -25%; top: 310px; }
  .hero-chameleon { width: 590px; right: 50%; transform: translateX(58%); bottom: -10px; }
  .landing-section { padding: 55px 0; }
  .split-heading { display: block; text-align: center; }
  .section-heading h2 { font-size: 32px; }
  .section-heading > p { margin-top: 14px; }
  .pricing-grid { grid-template-columns: 1fr; gap: 38px; }
  .price-card { min-height: 350px; }
  .steps { display: grid; grid-template-columns: 1fr 1fr; gap: 32px 16px; }
  .steps li { width: auto; }
  .step-arrow { display: none; }
  .steps li:last-of-type { grid-column: 1 / -1; width: 50%; justify-self: center; }
  .features-grid { grid-template-columns: 1fr; }
  .automation { grid-template-columns: 1fr; gap: 20px; }
  .automation-image { min-height: 220px; }
  .automation-copy { padding: 0; text-align: center; }
  .automation-list { padding: 22px; grid-template-columns: 1fr 1fr; }
  .final-cta { height: 390px; display: block; text-align: center; padding: 38px 24px; }
  .final-cta > img { width: 100%; height: 52%; top: auto; bottom: 0; }
  .final-cta::after { background: linear-gradient(180deg, rgba(249,248,255,1) 0 48%, rgba(249,248,255,.2) 80%); }
  .cta-copy { padding: 0; }
  .cta-copy > p:last-child { margin-inline: auto; }
  .cta-action { margin-top: 18px; }
  .cta-mantra { display: none; }
  .footer-main { padding: 28px 0; display: flex; flex-wrap: wrap; gap: 28px; }
  .footer-main nav { width: 100%; flex-wrap: wrap; justify-content: flex-start; gap: 12px 22px; }
  .social-links { margin-left: auto; }
}

@media (max-width: 430px) {
  .landing-header { height: 64px; }
  .landing-brand { font-size: 20px; }
  .brand-mark { width: 36px; height: 36px; }
  .hero { min-height: 735px; }
  .hero-inner { min-height: 735px; }
  .hero-copy { padding-top: 38px; }
  .hero h1 { font-size: 34px; }
  .hero-actions { display: grid; padding-inline: 28px; }
  .hero-actions .pill-button { min-width: 0; }
  .social-proof { margin-top: 22px; }
  .hero-visual { height: 280px; }
  .hero-chameleon { width: 490px; }
  .section-heading h2 { font-size: 28px; }
  .features-grid { gap: 10px; }
  .feature-item { padding-inline: 13px; }
  .automation-list { grid-template-columns: 1fr; }
  .footer-main { display: grid; grid-template-columns: 1fr; }
  .social-links { margin: 0; justify-content: flex-start; }
  .footer-bottom { padding-top: 18px; display: grid; gap: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .pill-button { transition: none; }
}

/* O aviso do que o sistema ainda não faz, na própria seção de preço.
   Quem descobre isso depois de pagar pede estorno — e tem razão. */
.pricing-note {
  max-width: 900px; margin: 34px auto 0; padding: 18px 22px;
  border-radius: 14px; background: #FFF9ED; border: 1px solid #F5E3BD;
  font-size: 14px; line-height: 1.7; color: #7A6534;
}
.pricing-note b { display: block; margin-bottom: 6px; color: #6B5320; }

/* A prova social sem número inventado: só a frase. */
.social-proof p { margin: 0; }
