:root {
  --purple: #8c58a2;
  --purple-dark: #4c1d63;
  --purple-deep: #2a0d39;
  --purple-soft: #f2eaf6;
  --blue-dark: #233247;
  --ink: #16131b;
  --muted: #625d69;
  --line: #e6dfea;
  --surface: #ffffff;
  --surface-alt: #f7f5f8;
  --green: #13845b;
  --shadow: 0 24px 70px rgba(42, 13, 57, .12);
  --radius-lg: 32px;
  --radius-md: 22px;
  --container: min(1180px, calc(100% - 40px));
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: var(--ink); background: #fff; line-height: 1.55; }
img { max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
.container { width: var(--container); margin-inline: auto; }
.skip-link { position: fixed; left: 16px; top: -100px; z-index: 9999; background: #fff; padding: 12px 18px; border-radius: 10px; box-shadow: var(--shadow); }
.skip-link:focus { top: 16px; }

.utility-bar { background: var(--purple-deep); color: #fff; font-size: .88rem; }
.utility-content { min-height: 38px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.utility-content div { display: flex; gap: 24px; }
.utility-content a { opacity: .9; }
.utility-content a:hover { opacity: 1; }

.site-header { position: sticky; top: 0; z-index: 1000; background: rgba(255,255,255,.96); backdrop-filter: blur(16px); border-bottom: 1px solid rgba(140,88,162,.12); }
.nav-wrap { min-height: 96px; display: flex; align-items: center; justify-content: space-between; gap: 36px; }
.brand { display: flex; align-items: center; flex: 0 0 auto; }
.brand img { width: 320px; display: block; }
.main-nav { display: flex; align-items: center; gap: 24px; font-weight: 750; font-size: .96rem; white-space: nowrap; }
.main-nav > a:not(.nav-login):not(.nav-demo) { position: relative; padding-block: 34px; }
.main-nav > a:not(.nav-login):not(.nav-demo)::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 22px; height: 3px; background: linear-gradient(90deg, var(--purple), #af60cb); border-radius: 99px; transition: right .25s ease; }
.main-nav > a:hover::after { right: 0; }
.nav-login { border: 1px solid var(--purple); color: var(--purple-dark); border-radius: 14px; padding: 12px 17px; }
.nav-demo { background: linear-gradient(135deg, var(--purple-dark), var(--purple)); color: white; border-radius: 14px; padding: 13px 18px; box-shadow: 0 10px 24px rgba(76,29,99,.18); }
.menu-button { display: none; border: 0; background: transparent; padding: 8px; }
.menu-button span { display: block; width: 27px; height: 3px; background: var(--purple-deep); margin: 5px; border-radius: 99px; transition: .2s; }

.hero { position: relative; overflow: hidden; background: radial-gradient(circle at 15% 12%, rgba(180,122,202,.25), transparent 34%), radial-gradient(circle at 83% 25%, rgba(64,106,144,.16), transparent 35%), linear-gradient(135deg, #fbf6fc 0%, #f7f4f8 52%, #edf2f5 100%); }
.hero::after { content: ""; position: absolute; width: 520px; height: 520px; border-radius: 50%; border: 1px solid rgba(140,88,162,.12); right: -180px; top: -170px; box-shadow: 0 0 0 70px rgba(140,88,162,.035), 0 0 0 140px rgba(140,88,162,.025); }
.hero-grid-bg { position: absolute; inset: 0; background-image: linear-gradient(rgba(70,55,80,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(70,55,80,.045) 1px, transparent 1px); background-size: 64px 64px; mask-image: linear-gradient(to right, rgba(0,0,0,.6), transparent); }
.hero-grid { position: relative; z-index: 2; min-height: 720px; display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(520px, .98fr); align-items: center; gap: 58px; padding-block: 82px; }
.eyebrow { display: inline-flex; align-items: center; gap: 12px; color: var(--purple-dark); font-size: .82rem; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.eyebrow::before { content: ""; width: 34px; height: 3px; background: var(--purple); border-radius: 99px; }
.eyebrow.light { color: #e2c9eb; }
.eyebrow.light::before { background: #e2c9eb; }
.hero h1 { margin: 24px 0 22px; font-size: clamp(3.3rem, 5.5vw, 5.6rem); line-height: .98; letter-spacing: -.055em; color: #26112f; max-width: 820px; }
.hero-lead { margin: 0; max-width: 760px; font-size: 1.2rem; color: #544b59; line-height: 1.75; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 56px; padding: 0 24px; border-radius: 16px; font-weight: 850; border: 0; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { color: #fff; background: linear-gradient(135deg, var(--purple-dark), #9d4fc0); box-shadow: 0 18px 38px rgba(76,29,99,.22); }
.button-secondary { color: var(--purple-dark); background: rgba(255,255,255,.72); border: 1px solid rgba(76,29,99,.17); }
.button-light { color: var(--purple-deep); background: #fff; }
.button-form { width: 100%; color: #fff; background: linear-gradient(135deg, var(--purple-dark), var(--purple)); margin-top: 18px; }
.trust-list { display: flex; flex-wrap: wrap; gap: 22px; padding: 0; margin: 28px 0 0; list-style: none; font-size: .92rem; font-weight: 760; color: #4d4751; }
.trust-list li::before { content: "✓"; display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; margin-right: 8px; background: rgba(19,132,91,.12); color: var(--green); }

.platform-preview { position: relative; min-height: 520px; }
.preview-window { position: relative; z-index: 2; overflow: hidden; background: #fff; border-radius: 28px; border: 1px solid rgba(88,61,101,.12); box-shadow: 0 38px 90px rgba(35,50,71,.18); transform: rotate(1.2deg); }
.window-top { min-height: 48px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 16px; background: #f8f7fa; border-bottom: 1px solid #eee9f0; font-size: .76rem; color: #6c6571; }
.window-dots { display: flex; gap: 6px; }
.window-dots span { width: 9px; height: 9px; border-radius: 50%; background: #d9cddb; }
.secure-badge { justify-self: end; color: var(--green); font-weight: 800; }
.preview-body { display: grid; grid-template-columns: 66px 1fr; min-height: 460px; }
.preview-sidebar { background: linear-gradient(180deg, #341442, #4f2360); display: flex; flex-direction: column; align-items: center; gap: 20px; padding-top: 18px; }
.mini-logo { width: 36px; height: 36px; border-radius: 12px; display: grid; place-items: center; background: #fff; color: var(--purple-dark); font-weight: 950; }
.preview-sidebar span { width: 27px; height: 7px; border-radius: 99px; background: rgba(255,255,255,.22); }
.preview-sidebar span.active { background: #fff; }
.preview-content { padding: 24px; background: linear-gradient(180deg, #fff, #fbf9fc); }
.search-panel { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 15px 17px; border: 1px solid #eadfeb; border-radius: 14px; background: #fff; }
.search-panel small, .metric-row small { display: block; color: #867d8a; font-size: .7rem; }
.search-panel strong { display: block; margin-top: 2px; font-size: .9rem; }
.search-panel button { border: 0; border-radius: 10px; padding: 9px 15px; background: var(--purple); color: #fff; font-weight: 800; }
.source-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 14px; }
.source-row article { padding: 12px; border-radius: 12px; background: #f4edf7; }
.source-row b { display: block; font-size: .72rem; color: var(--purple-dark); }
.source-row span { font-size: .67rem; color: #766c7a; }
.metric-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 14px; }
.metric-row article { padding: 13px; border: 1px solid #eee7f0; border-radius: 13px; }
.metric-row strong { display: block; margin-top: 3px; font-size: .86rem; }
.chart-card { margin-top: 14px; padding: 16px; border-radius: 14px; background: #fff; border: 1px solid #eee7f0; }
.chart-heading { display: flex; justify-content: space-between; font-size: .7rem; color: #6e6572; }
.bars { height: 112px; margin-top: 16px; display: flex; align-items: end; gap: 9px; }
.bars i { flex: 1; display: block; border-radius: 8px 8px 2px 2px; background: linear-gradient(180deg, #ad6bc4, #5c2c70); opacity: .9; }
.preview-footer { margin-top: 13px; padding-top: 13px; border-top: 1px solid #eee7f0; display: flex; justify-content: space-between; font-size: .7rem; color: #706676; }
.preview-footer b { color: var(--purple-dark); }
.floating-card { position: absolute; z-index: 3; padding: 15px 17px; border-radius: 16px; background: rgba(255,255,255,.94); border: 1px solid rgba(140,88,162,.14); box-shadow: 0 20px 50px rgba(42,13,57,.15); backdrop-filter: blur(10px); }
.floating-card b, .floating-card small { display: block; }
.floating-card small { color: #726a75; font-size: .7rem; margin-top: 3px; }
.float-one { left: -34px; bottom: 72px; }
.float-one span { display: inline-block; margin-bottom: 7px; padding: 4px 8px; border-radius: 7px; background: #2f123d; color: #fff; font-size: .65rem; font-weight: 900; }
.float-two { right: -24px; top: 85px; max-width: 190px; }

.proof-strip { background: #fff; border-block: 1px solid #eee8f0; }
.proof-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.proof-grid article { padding: 26px 22px; border-right: 1px solid #eee8f0; }
.proof-grid article:last-child { border-right: 0; }
.proof-grid strong, .proof-grid span { display: block; }
.proof-grid strong { color: var(--purple-dark); font-size: 1.02rem; }
.proof-grid span { color: #756c78; font-size: .84rem; margin-top: 4px; }

.section { padding: 110px 0; }
.section-light { background: var(--surface-alt); }
.split-section { display: grid; grid-template-columns: .8fr 1.2fr; gap: 78px; align-items: start; }
.section-copy h2, .section-heading h2 { margin: 20px 0 18px; font-size: clamp(2.4rem, 4vw, 4.25rem); line-height: 1.05; letter-spacing: -.045em; color: #27132f; }
.section-copy p, .section-heading p { color: var(--muted); font-size: 1.06rem; line-height: 1.78; }
.text-link { display: inline-flex; gap: 12px; margin-top: 18px; color: var(--purple-dark); font-weight: 850; }
.benefit-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.benefit-grid article { padding: 27px; background: #fff; border: 1px solid #ece5ef; border-radius: var(--radius-md); box-shadow: 0 18px 45px rgba(42,13,57,.055); }
.icon-box { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--purple-soft); color: var(--purple-dark); font-size: 1.35rem; font-weight: 900; }
.benefit-grid h3, .feature-card h3 { margin: 18px 0 10px; color: #2c1834; }
.benefit-grid p, .feature-card p { margin: 0; color: #6a626d; }
.section-heading { max-width: 800px; margin-bottom: 46px; }
.section-heading.centered { text-align: center; margin-inline: auto; }
.section-heading.centered .eyebrow { justify-content: center; }
.feature-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.feature-card { position: relative; min-height: 245px; padding: 30px; border: 1px solid #e9e2eb; border-radius: 24px; background: linear-gradient(160deg, #fff, #fbf9fc); overflow: hidden; }
.feature-card::after { content: ""; position: absolute; width: 120px; height: 120px; border-radius: 50%; background: rgba(140,88,162,.05); right: -36px; bottom: -40px; }
.feature-card > span { color: var(--purple); font-weight: 900; letter-spacing: .12em; font-size: .78rem; }

.workflow-section { position: relative; overflow: hidden; color: #fff; background: radial-gradient(circle at 80% 15%, rgba(168,99,194,.34), transparent 32%), linear-gradient(135deg, #281034, #4b1d60 58%, #21354b); }
.workflow-section::after { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px); background-size: 64px 64px; }
.workflow-section .container { position: relative; z-index: 2; }
.workflow-section .section-heading h2, .workflow-section .section-heading p { color: #fff; }
.workflow-section .section-heading p { opacity: .75; }
.workflow-list { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; list-style: none; padding: 0; margin: 55px 0 0; }
.workflow-list li { position: relative; min-height: 260px; padding: 26px 22px; border-radius: 22px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); backdrop-filter: blur(10px); }
.workflow-list li > span { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: rgba(255,255,255,.14); font-weight: 900; }
.workflow-list h3 { margin: 26px 0 10px; }
.workflow-list p { color: rgba(255,255,255,.72); font-size: .92rem; }

.dex-section { background: linear-gradient(180deg, #fff, #faf7fb); }
.dex-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 82px; align-items: center; }
.dex-visual { position: relative; min-height: 520px; display: grid; place-items: center; }
.dex-core { position: relative; z-index: 3; width: 190px; height: 190px; border-radius: 50%; display: grid; place-items: center; text-align: center; color: #fff; background: radial-gradient(circle at 35% 28%, #b36fca, #5f2a73 58%, #281034); box-shadow: 0 0 0 20px rgba(140,88,162,.08), 0 35px 80px rgba(76,29,99,.25); }
.dex-core span { display: block; font-size: 2.2rem; font-weight: 950; letter-spacing: .08em; }
.dex-core small { display: block; margin-top: -48px; opacity: .75; }
.dex-orbit { position: absolute; border-radius: 50%; border: 1px solid rgba(140,88,162,.2); }
.orbit-one { width: 340px; height: 340px; }
.orbit-two { width: 500px; height: 500px; border-style: dashed; }
.dex-note { position: absolute; z-index: 4; padding: 14px 18px; border-radius: 14px; background: #fff; border: 1px solid #e7dce9; box-shadow: 0 16px 38px rgba(42,13,57,.1); color: #4d3157; font-weight: 800; font-size: .86rem; }
.note-a { top: 56px; left: 20px; }
.note-b { top: 160px; right: 0; }
.note-c { bottom: 68px; left: 65px; }
.check-list { list-style: none; padding: 0; margin: 24px 0 0; display: grid; gap: 13px; }
.check-list li { position: relative; padding-left: 34px; font-weight: 750; color: #433a46; }
.check-list li::before { content: "✓"; position: absolute; left: 0; top: 0; display: grid; place-items: center; width: 23px; height: 23px; border-radius: 50%; background: var(--purple-soft); color: var(--purple-dark); }

.audience-section { background: #f3edf5; }
.audience-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.audience-grid article { padding: 28px; border-radius: 22px; background: rgba(255,255,255,.72); border: 1px solid rgba(140,88,162,.12); }
.audience-grid b { color: #32183d; font-size: 1.05rem; }
.audience-grid p { color: #6b626e; font-size: .91rem; }

.demo-section { color: #fff; background: linear-gradient(145deg, #25102f, #4a1e5d 62%, #263a4e); }
.demo-section .section-copy h2, .demo-section .section-copy p { color: #fff; }
.demo-section .section-copy p { opacity: .78; }
.demo-grid { display: grid; grid-template-columns: .82fr 1.18fr; gap: 66px; align-items: start; }
.contact-cards { display: grid; gap: 12px; margin-top: 30px; }
.contact-cards a { padding: 16px 18px; border: 1px solid rgba(255,255,255,.14); border-radius: 15px; background: rgba(255,255,255,.07); }
.contact-cards strong, .contact-cards span { display: block; }
.contact-cards span { color: rgba(255,255,255,.7); font-size: .88rem; margin-top: 3px; }
.demo-form { padding: 32px; background: #fff; color: var(--ink); border-radius: 28px; box-shadow: 0 30px 80px rgba(0,0,0,.22); }
.form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 17px; }
.form-grid label { display: grid; gap: 7px; color: #352b39; font-size: .82rem; font-weight: 800; }
.form-grid input, .form-grid select, .form-grid textarea { width: 100%; border: 1px solid #dfd5e2; border-radius: 12px; background: #fdfcfd; padding: 13px 14px; outline: none; color: #27212a; }
.form-grid input:focus, .form-grid select:focus, .form-grid textarea:focus { border-color: var(--purple); box-shadow: 0 0 0 4px rgba(140,88,162,.11); }
.full-field { grid-column: 1 / -1; }
.form-note { margin: 12px 0 0; text-align: center; color: #7a727e; font-size: .74rem; }

.faq-grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: 74px; align-items: start; }
.accordion details { border-bottom: 1px solid #e7dfe9; }
.accordion summary { list-style: none; cursor: pointer; padding: 23px 48px 23px 0; font-weight: 850; font-size: 1.02rem; position: relative; }
.accordion summary::-webkit-details-marker { display: none; }
.accordion summary::after { content: "+"; position: absolute; right: 8px; top: 18px; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 10px; background: var(--purple-soft); color: var(--purple-dark); font-size: 1.25rem; }
.accordion details[open] summary::after { content: "−"; }
.accordion p { margin: -5px 0 22px; color: #6b626e; max-width: 760px; }

.final-cta { padding: 78px 0; background: linear-gradient(105deg, #8c58a2, #4c1d63 60%, #2b4054); color: #fff; }
.final-cta-content { display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.final-cta span { font-size: .82rem; text-transform: uppercase; letter-spacing: .14em; font-weight: 900; opacity: .75; }
.final-cta h2 { margin: 10px 0 0; max-width: 800px; font-size: clamp(2rem, 4vw, 3.5rem); line-height: 1.08; letter-spacing: -.04em; }

.site-footer { color: #ded4e2; background: #1e0a28; }
.footer-grid { display: grid; grid-template-columns: 1.55fr .8fr .8fr 1fr; gap: 52px; padding: 70px 0 50px; }
.footer-brand img { width: 330px; filter: brightness(0) invert(1); opacity: .94; }
.footer-brand p { max-width: 410px; color: #ab9eb0; }
.footer-grid h3 { margin: 0 0 18px; color: #fff; font-size: .92rem; }
.footer-grid > div:not(.footer-brand) { display: flex; flex-direction: column; gap: 10px; }
.footer-grid a { color: #afa4b4; font-size: .88rem; }
.footer-grid a:hover { color: #fff; }
.footer-bottom { min-height: 70px; display: flex; align-items: center; justify-content: space-between; gap: 30px; border-top: 1px solid rgba(255,255,255,.08); color: #8e8194; font-size: .8rem; }
.whatsapp-float { position: fixed; right: 22px; bottom: 22px; z-index: 50; width: 58px; height: 58px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #19bd68; font-weight: 950; box-shadow: 0 18px 35px rgba(0,0,0,.18); border: 4px solid #fff; }

.reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
.reveal.visible { opacity: 1; transform: none; }

@media (max-width: 1120px) {
  .brand img { width: 270px; }
  .main-nav { gap: 15px; font-size: .88rem; }
  .hero-grid { grid-template-columns: 1fr; }
  .platform-preview { width: min(720px, 100%); margin-inline: auto; }
  .split-section, .dex-grid, .demo-grid, .faq-grid { grid-template-columns: 1fr; }
  .workflow-list { grid-template-columns: repeat(3, 1fr); }
  .audience-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 900px) {
  .utility-bar { display: none; }
  .nav-wrap { min-height: 80px; }
  .brand img { width: 235px; }
  .menu-button { display: block; }
  .main-nav { position: fixed; inset: 80px 0 auto; display: none; flex-direction: column; align-items: stretch; gap: 0; padding: 18px 20px 24px; background: #fff; border-bottom: 1px solid #e8dfea; box-shadow: 0 22px 45px rgba(42,13,57,.13); }
  .main-nav.open { display: flex; }
  .main-nav > a:not(.nav-login):not(.nav-demo) { padding: 14px 6px; border-bottom: 1px solid #eee7f0; }
  .main-nav > a:not(.nav-login):not(.nav-demo)::after { display: none; }
  .nav-login, .nav-demo { margin-top: 10px; text-align: center; }
  .hero-grid { min-height: auto; padding-block: 68px; }
  .hero h1 { font-size: clamp(3rem, 10vw, 4.6rem); }
  .proof-grid { grid-template-columns: repeat(2, 1fr); }
  .proof-grid article:nth-child(2) { border-right: 0; }
  .proof-grid article:nth-child(-n+2) { border-bottom: 1px solid #eee8f0; }
  .feature-cards { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 680px) {
  :root { --container: min(100% - 26px, 1180px); }
  .brand img { width: 210px; }
  .hero-grid { padding-block: 54px; gap: 44px; }
  .hero h1 { font-size: clamp(2.65rem, 13vw, 4rem); }
  .hero-lead { font-size: 1.02rem; }
  .hero-actions { flex-direction: column; }
  .button { width: 100%; }
  .trust-list { display: grid; gap: 12px; }
  .platform-preview { min-height: 420px; }
  .preview-window { transform: none; border-radius: 20px; }
  .window-top { grid-template-columns: auto 1fr; }
  .window-top > span:nth-child(2) { text-align: center; }
  .secure-badge { display: none; }
  .preview-body { grid-template-columns: 44px 1fr; min-height: 380px; }
  .preview-sidebar { gap: 14px; padding-top: 14px; }
  .mini-logo { width: 28px; height: 28px; font-size: .72rem; }
  .preview-sidebar span { width: 20px; }
  .preview-content { padding: 13px; }
  .source-row, .metric-row { gap: 6px; }
  .source-row article, .metric-row article { padding: 8px; }
  .search-panel button { display: none; }
  .chart-card { padding: 11px; }
  .chart-heading span { display: none; }
  .bars { height: 80px; gap: 5px; }
  .floating-card { display: none; }
  .proof-grid, .benefit-grid, .feature-cards, .audience-grid, .form-grid { grid-template-columns: 1fr; }
  .proof-grid article { border-right: 0; border-bottom: 1px solid #eee8f0; }
  .proof-grid article:last-child { border-bottom: 0; }
  .section { padding: 78px 0; }
  .section-copy h2, .section-heading h2 { font-size: clamp(2.2rem, 11vw, 3.4rem); }
  .workflow-list { grid-template-columns: 1fr; }
  .workflow-list li { min-height: auto; }
  .dex-visual { min-height: 430px; transform: scale(.88); }
  .orbit-two { width: 420px; height: 420px; }
  .demo-form { padding: 22px; border-radius: 22px; }
  .full-field { grid-column: auto; }
  .final-cta-content { flex-direction: column; align-items: flex-start; }
  .footer-grid { grid-template-columns: 1fr; gap: 34px; }
  .footer-bottom { flex-direction: column; align-items: flex-start; justify-content: center; padding-block: 18px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}

/* =========================================================
   V2 — MENU PLATAFORMA CUSTOPÚBLICO
   Cabeçalho inspirado no modelo anterior, com cards e ícones.
   ========================================================= */
.svg-sprite{position:absolute;width:0;height:0;overflow:hidden}
.svg-sprite symbol,.platform-topbar svg,.platform-menu svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.anchor-target{position:absolute;top:0}
.platform-topbar{background:#111b2c;color:#dce5ef}
.platform-topbar-inner{width:min(calc(100% - 32px),1520px);min-height:40px;margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:22px;font-size:.78rem}
.platform-topbar p{margin:0}
.platform-topbar p span{display:inline-flex;margin-right:8px;padding:3px 9px;border-radius:999px;color:#fff;background:var(--purple);font-size:.66rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase}
.platform-topbar a{display:inline-flex;align-items:center;gap:8px;color:#fff;font-weight:800;white-space:nowrap}
.platform-topbar a svg{width:16px;height:16px}
.site-header{position:sticky;top:0;z-index:1000;overflow:visible;background:rgba(247,244,248,.93);border-bottom:1px solid rgba(33,48,71,.08);backdrop-filter:blur(18px);transition:box-shadow .25s ease}
.site-header.scrolled{box-shadow:0 12px 38px rgba(18,29,44,.10)}
.platform-header-container{width:min(calc(100% - 30px),1580px);margin-inline:auto}
.platform-nav-shell{min-height:104px;display:grid;grid-template-columns:minmax(250px,330px) minmax(620px,1fr) auto;align-items:center;gap:16px;padding:12px 0}
.brand-cluster{display:flex;align-items:center;gap:14px;min-width:0}
.brand{width:270px;max-width:100%;display:block;line-height:0}
.brand img{width:100%;max-height:78px;object-fit:contain;object-position:left center}
.brand-note{display:none;flex-direction:column;gap:2px;padding-left:14px;border-left:1px solid rgba(82,38,95,.14)}
.brand-note strong{color:#111b2c;font-size:.76rem;line-height:1.2}
.brand-note span{max-width:180px;color:#7a8699;font-size:.65rem;line-height:1.35}
.main-nav.platform-menu{min-width:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:stretch;gap:7px;padding:7px;border:1px solid rgba(86,61,106,.12);border-radius:23px;background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(245,240,247,.97));box-shadow:0 14px 40px rgba(27,38,56,.07);font-size:inherit;white-space:normal}
.main-nav.platform-menu>a.platform-menu-card{position:relative;min-width:0;min-height:64px;display:flex;align-items:center;gap:9px;padding:9px 10px;border:1px solid transparent;border-radius:16px;color:#4e5a6d;transition:transform .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease,color .18s ease}
.main-nav.platform-menu>a.platform-menu-card::after{display:none}
.main-nav.platform-menu>a.platform-menu-card:hover,.main-nav.platform-menu>a.platform-menu-card:focus-visible{color:#111b2c;transform:translateY(-2px);background:#fff;border-color:rgba(140,88,162,.18);box-shadow:0 12px 28px rgba(30,41,57,.09);outline:none}
.nav-icon{width:36px;height:36px;display:grid;place-items:center;flex:0 0 auto;border-radius:12px;background:rgba(140,88,162,.10);color:var(--purple-dark)}
.nav-icon svg{width:18px;height:18px}
.nav-copy{min-width:0;display:flex;flex-direction:column;align-items:flex-start;line-height:1.12}
.nav-copy strong{display:block;max-width:100%;color:#111b2c;font-size:.76rem;font-weight:900;white-space:nowrap}
.nav-copy small{display:block;max-width:100%;margin-top:4px;color:#8b95a4;font-size:.55rem;font-weight:800;letter-spacing:.035em;text-transform:uppercase;white-space:nowrap}
.nav-dex-pill{background:linear-gradient(180deg,rgba(140,88,162,.13),rgba(140,88,162,.035));border-color:rgba(140,88,162,.17)!important}
.nav-dex-pill .nav-icon{background:linear-gradient(135deg,rgba(140,88,162,.20),rgba(82,38,95,.10))}
.header-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.header-actions .nav-login,.header-actions .nav-demo{min-height:46px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px;padding:0 15px;font-size:.8rem;font-weight:900;white-space:nowrap}
.header-actions .nav-login{border:1px solid var(--line);color:#111b2c;background:rgba(255,255,255,.84)}
.header-actions .nav-login:hover{color:var(--purple-dark);border-color:rgba(140,88,162,.28)}
.header-actions .nav-demo{color:#fff;background:linear-gradient(135deg,var(--purple-dark),var(--purple));box-shadow:0 14px 30px rgba(111,57,127,.20)}
.menu-button{display:none;position:relative;z-index:3;width:46px;height:46px;border:1px solid rgba(140,88,162,.18);border-radius:13px;background:#fff;cursor:pointer}
.menu-button span{display:block;width:24px;height:3px;margin:4px auto;background:var(--purple-deep);border-radius:99px;transition:transform .2s ease,opacity .2s ease}
.menu-button[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-button[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-button[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.sources-showcase{background:linear-gradient(145deg,#f4edf7 0%,#eef3f5 55%,#f8f5f2 100%)}
.source-showcase-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.source-showcase-grid article{min-height:122px;display:flex;flex-direction:column;justify-content:center;padding:22px;border:1px solid rgba(92,70,104,.12);border-radius:20px;background:rgba(255,255,255,.78);box-shadow:0 14px 34px rgba(42,13,57,.055)}
.source-showcase-grid span{color:var(--purple-dark);font-size:1.05rem;font-weight:900}
.source-showcase-grid small{margin-top:8px;color:var(--muted);font-size:.82rem;line-height:1.45}
.documents-showcase{background:linear-gradient(145deg,#f5f1ea 0%,#f3edf5 48%,#edf2f5 100%)}
.documents-showcase-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:56px;align-items:center}
.documents-showcase-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.documents-showcase-grid article{min-height:138px;padding:24px;border:1px solid rgba(92,70,104,.12);border-radius:20px;background:rgba(255,255,255,.82);box-shadow:0 15px 38px rgba(42,13,57,.055)}
.documents-showcase-grid b{display:block;color:#281331;font-size:1rem}
.documents-showcase-grid span{display:block;margin-top:9px;color:var(--muted);font-size:.86rem;line-height:1.55}

@media(min-width:1480px){
  .brand-note{display:flex}
  .platform-nav-shell{grid-template-columns:minmax(360px,430px) minmax(650px,1fr) auto}
  .brand{width:285px}
  .nav-copy strong{font-size:.8rem}
}
@media(max-width:1320px){
  .platform-nav-shell{grid-template-columns:235px minmax(590px,1fr) auto;gap:10px}
  .brand{width:225px}
  .main-nav.platform-menu{gap:5px;padding:6px}
  .main-nav.platform-menu>a.platform-menu-card{min-height:58px;gap:7px;padding:8px}
  .nav-icon{width:32px;height:32px}
  .nav-copy strong{font-size:.7rem}
  .nav-copy small{font-size:.48rem}
  .header-actions .nav-login,.header-actions .nav-demo{padding-inline:11px;font-size:.72rem}
}
@media(max-width:1080px){
  .platform-topbar a{display:none}
  .platform-topbar-inner{justify-content:center;text-align:center}
  .platform-nav-shell{position:relative;grid-template-columns:1fr auto;gap:12px;min-height:82px;padding:10px 0}
  .brand{width:245px}
  .menu-button{display:block}
  .main-nav.platform-menu{position:absolute;left:0;right:0;top:calc(100% + 8px);display:none;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;padding:14px;border-radius:20px;background:#f9f6fa;box-shadow:0 24px 60px rgba(22,30,43,.20)}
  .main-nav.platform-menu.open{display:grid}
  .main-nav.platform-menu>a.platform-menu-card{min-height:68px;background:#fff;border-color:rgba(86,61,106,.09)}
  .header-actions{grid-column:1/-1;display:grid;grid-template-columns:1fr 1.25fr;width:100%}
  .header-actions .nav-login,.header-actions .nav-demo{width:100%}
  .site-header.menu-open{box-shadow:0 22px 55px rgba(18,29,44,.14)}
  .source-showcase-grid{grid-template-columns:repeat(2,1fr)}
  .documents-showcase-layout{grid-template-columns:1fr}
}
@media(max-width:700px){
  .platform-topbar-inner{font-size:.68rem;line-height:1.35;padding-block:7px}
  .platform-topbar p span{display:none}
  .platform-header-container{width:min(calc(100% - 20px),1580px)}
  .brand{width:210px}
  .platform-nav-shell{min-height:72px}
  .main-nav.platform-menu{grid-template-columns:1fr;max-height:70vh;overflow-y:auto}
  .main-nav.platform-menu>a.platform-menu-card{min-height:62px}
  .header-actions{gap:7px}
  .header-actions .nav-login,.header-actions .nav-demo{min-height:42px;padding-inline:8px;font-size:.7rem}
  .source-showcase-grid,.documents-showcase-grid{grid-template-columns:1fr}
}

/* =========================================================
   V3 — TIPOGRAFIA DO MENU MAIOR E MAIS COERENTE
   Mantém os cards do menu e aumenta títulos, subtítulos e ações.
   ========================================================= */
@media (min-width: 1480px) {
  .platform-header-container {
    width: min(calc(100% - 34px), 1780px);
  }
  .platform-nav-shell {
    min-height: 116px;
    grid-template-columns: minmax(300px, 360px) minmax(820px, 1fr) auto;
    gap: 18px;
    padding-block: 14px;
  }
  .brand {
    width: 292px;
  }
  .brand-note {
    display: none;
  }
  .main-nav.platform-menu {
    gap: 9px;
    padding: 8px;
    border-radius: 25px;
  }
  .main-nav.platform-menu > a.platform-menu-card {
    min-height: 76px;
    gap: 12px;
    padding: 11px 13px;
    border-radius: 17px;
  }
  .nav-icon {
    width: 43px;
    height: 43px;
    border-radius: 13px;
  }
  .nav-icon svg {
    width: 22px;
    height: 22px;
  }
  .nav-copy {
    line-height: 1.08;
  }
  .nav-copy strong {
    font-size: 1rem;
    letter-spacing: -.012em;
  }
  .nav-copy small {
    margin-top: 6px;
    font-size: .66rem;
    line-height: 1.15;
    letter-spacing: .045em;
  }
  .header-actions {
    gap: 10px;
  }
  .header-actions .nav-login,
  .header-actions .nav-demo {
    min-height: 54px;
    padding-inline: 18px;
    border-radius: 14px;
    font-size: .94rem;
  }
}

@media (min-width: 1321px) and (max-width: 1479px) {
  .platform-header-container {
    width: min(calc(100% - 24px), 1450px);
  }
  .platform-nav-shell {
    grid-template-columns: 240px minmax(700px, 1fr) auto;
    gap: 10px;
  }
  .brand {
    width: 232px;
  }
  .brand-note {
    display: none;
  }
  .main-nav.platform-menu > a.platform-menu-card {
    min-height: 69px;
    gap: 8px;
    padding: 9px;
  }
  .nav-icon {
    width: 36px;
    height: 36px;
  }
  .nav-copy strong {
    font-size: .86rem;
  }
  .nav-copy small {
    font-size: .56rem;
  }
  .header-actions .nav-login,
  .header-actions .nav-demo {
    min-height: 48px;
    padding-inline: 12px;
    font-size: .8rem;
  }
}

/* No menu recolhível, a leitura também fica maior. */
@media (max-width: 1080px) {
  .main-nav.platform-menu .nav-copy strong {
    font-size: .94rem;
  }
  .main-nav.platform-menu .nav-copy small {
    font-size: .65rem;
  }
}

/* =========================================================
   V4 — MENU REALMENTE MAIOR
   Tipografia ampliada de forma perceptível, com mais altura,
   ícones maiores e quebra antecipada para o menu móvel.
   ========================================================= */
@media (min-width: 1281px) {
  .platform-header-container {
    width: min(calc(100% - 28px), 1880px);
  }

  .platform-nav-shell {
    min-height: 128px;
    grid-template-columns: minmax(300px, 350px) minmax(900px, 1fr) auto;
    gap: 18px;
    padding: 16px 0;
  }

  .brand {
    width: 320px;
  }

  .brand img {
    max-height: 92px;
  }

  .brand-note {
    display: none;
  }

  .main-nav.platform-menu {
    grid-template-columns: repeat(5, minmax(150px, 1fr));
    gap: 10px;
    padding: 10px;
    border-radius: 28px;
  }

  .main-nav.platform-menu > a.platform-menu-card {
    min-height: 84px;
    gap: 13px;
    padding: 13px 14px;
    border-radius: 19px;
  }

  .nav-icon {
    width: 48px;
    height: 48px;
    border-radius: 15px;
  }

  .nav-icon svg {
    width: 25px;
    height: 25px;
  }

  .nav-copy {
    line-height: 1.08;
  }

  .nav-copy strong {
    font-size: 1.12rem;
    font-weight: 950;
    letter-spacing: -.018em;
  }

  .nav-copy small {
    margin-top: 7px;
    font-size: .76rem;
    line-height: 1.18;
    letter-spacing: .035em;
    font-weight: 850;
  }

  .header-actions {
    gap: 12px;
  }

  .header-actions .nav-login,
  .header-actions .nav-demo {
    min-height: 60px;
    padding-inline: 20px;
    border-radius: 16px;
    font-size: 1.02rem;
    font-weight: 950;
  }
}

/* Em notebooks, preserva a leitura sem amontoar. */
@media (min-width: 1081px) and (max-width: 1280px) {
  .platform-header-container {
    width: min(calc(100% - 22px), 1260px);
  }

  .platform-nav-shell {
    grid-template-columns: 230px minmax(640px, 1fr) auto;
    gap: 9px;
  }

  .brand {
    width: 220px;
  }

  .main-nav.platform-menu > a.platform-menu-card {
    min-height: 72px;
    padding: 10px 9px;
  }

  .nav-icon {
    width: 38px;
    height: 38px;
  }

  .nav-copy strong {
    font-size: .92rem;
  }

  .nav-copy small {
    font-size: .61rem;
  }

  .header-actions .nav-login,
  .header-actions .nav-demo {
    min-height: 50px;
    padding-inline: 12px;
    font-size: .84rem;
  }
}

/* =========================================================
   V5 — AÇÕES NA FAIXA SUPERIOR
   Retira os botões da linha principal para liberar espaço ao
   menu e posiciona Entrar + Solicitar demonstração na faixa Dex.
   ========================================================= */
.topbar-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex: 0 0 auto;
}

.platform-topbar .topbar-actions a {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 15px;
  border-radius: 10px;
  font-size: .78rem;
  font-weight: 900;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  transition: transform .18s ease, background .18s ease, border-color .18s ease, color .18s ease;
}

.platform-topbar .topbar-login {
  color: #fff;
  border: 1px solid rgba(255,255,255,.42);
  background: rgba(255,255,255,.07);
}

.platform-topbar .topbar-demo {
  color: #fff;
  border: 1px solid rgba(255,255,255,.08);
  background: linear-gradient(135deg, #6f397f, #8c58a2);
  box-shadow: 0 8px 18px rgba(0,0,0,.18);
}

.platform-topbar .topbar-actions a:hover,
.platform-topbar .topbar-actions a:focus-visible {
  transform: translateY(-1px);
  outline: none;
}

.platform-topbar .topbar-login:hover,
.platform-topbar .topbar-login:focus-visible {
  background: rgba(255,255,255,.15);
  border-color: rgba(255,255,255,.72);
}

.platform-topbar .topbar-demo:hover,
.platform-topbar .topbar-demo:focus-visible {
  background: linear-gradient(135deg, #7c438e, #9b65af);
}

/* Sem ações na linha principal: mais largura para os cinco cards. */
@media (min-width: 1281px) {
  .platform-nav-shell {
    grid-template-columns: minmax(300px, 350px) minmax(0, 1fr);
  }

  .main-nav.platform-menu {
    grid-template-columns: repeat(5, minmax(165px, 1fr));
  }
}

@media (min-width: 1081px) and (max-width: 1280px) {
  .platform-nav-shell {
    grid-template-columns: 230px minmax(0, 1fr);
  }
}

/* No menu móvel as ações continuam visíveis na faixa superior. */
@media (max-width: 1080px) {
  .platform-topbar a {
    display: inline-flex;
  }

  .platform-topbar-inner {
    justify-content: space-between;
    text-align: left;
  }

  .platform-nav-shell {
    grid-template-columns: 1fr auto;
  }
}

@media (max-width: 720px) {
  .platform-topbar-inner {
    width: min(calc(100% - 16px), 1520px);
    align-items: center;
    gap: 8px;
    padding-block: 7px;
  }

  .platform-topbar p {
    min-width: 0;
    font-size: .62rem;
    line-height: 1.25;
  }

  .platform-topbar p span {
    display: none;
  }

  .topbar-actions {
    gap: 5px;
  }

  .platform-topbar .topbar-actions a {
    min-height: 31px;
    padding-inline: 9px;
    border-radius: 8px;
    font-size: .64rem;
  }

  .platform-topbar .topbar-demo {
    max-width: 112px;
    text-align: center;
    line-height: 1.12;
  }
}

@media (max-width: 460px) {
  .platform-topbar p {
    display: none;
  }

  .platform-topbar-inner,
  .topbar-actions {
    width: 100%;
  }

  .topbar-actions {
    display: grid;
    grid-template-columns: .75fr 1.25fr;
  }

  .platform-topbar .topbar-actions a {
    width: 100%;
  }
}
