:root {
  --bg: #F5F3EF;
  --bg-alt: #EBE8E1;
  --ink-900: #111111;
  --ink-700: #2A2A2A;
  --ink-500: #555555;
  --ink-300: #9C9994;
  --ink-200: #E5E2DC;
  --accent: #C1121F;
  --accent-dark: #780A12;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { font-family: 'Montserrat', system-ui, sans-serif; font-weight: 400; background: var(--bg); color: var(--ink-900); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: hidden; }
a { color: inherit; text-decoration: none; transition: color .2s ease; }
img { display: block; max-width: 100%; height: auto; }
button { font-family: inherit; cursor: pointer; border: 0; background: none; }

.wrap { max-width: 1280px; margin: 0 auto; padding: 0 32px; }
.wrap-narrow { max-width: 880px; margin: 0 auto; padding: 0 32px; }

.topbar { position: sticky; top: 0; z-index: 50; background: rgba(245, 243, 239, 0.94); backdrop-filter: saturate(180%) blur(12px); -webkit-backdrop-filter: saturate(180%) blur(12px); border-bottom: 1px solid var(--ink-200); }
.topbar-inner { display: flex; align-items: center; justify-content: space-between; height: 72px; gap: 32px; }
.brand { display: inline-flex; align-items: center; gap: 14px; }
.brand-mark { width: 32px; height: 32px; flex-shrink: 0; background-image: url('/assets/logo.svg'); background-size: contain; background-repeat: no-repeat; }
.brand-name { font-weight: 800; font-size: 12px; letter-spacing: -.01em; text-transform: uppercase; }

.primary { display: flex; align-items: center; gap: 32px; }
.primary a { font-size: 11px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-500); position: relative; padding: 4px 0; }
.primary a:hover { color: var(--ink-900); }
.primary a.cta { color: var(--ink-900); }
.primary a.cta::after { content: ''; position: absolute; left: 0; bottom: -2px; height: 2px; width: 100%; background: var(--accent); }

.menu-toggle { display: none; font-size: 11px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-900); }
.menu-mobile { display: none; flex-direction: column; padding: 16px 32px 24px; border-top: 1px solid var(--ink-200); background: var(--bg); }
.menu-mobile a { font-size: 13px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; padding: 12px 0; border-bottom: 1px solid var(--ink-200); }
.menu-mobile a:last-child { border-bottom: 0; }
@media (max-width: 800px) { .primary { display: none; } .menu-toggle { display: inline-block; } .menu-mobile.open { display: flex; } .wrap, .wrap-narrow { padding: 0 22px; } }

.hero-mega { position: relative; min-height: 92vh; display: flex; flex-direction: column; justify-content: flex-end; padding: 80px 0 64px; overflow: hidden; }
.hero-mega::before { content: ''; position: absolute; inset: 0; z-index: 0; background-image: url('https://images.unsplash.com/photo-1486325212027-8081e485255e?w=2000&q=80&auto=format&fit=crop'); background-size: cover; background-position: center; filter: grayscale(100%) contrast(1.1) brightness(0.62); }
.hero-mega::after { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(245,243,239,.05) 0%, rgba(245,243,239,.35) 60%, var(--bg) 100%); }
.hero-mega .wrap { position: relative; z-index: 2; }
.hero-mega .eyebrow { font-size: 11px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: rgba(255,255,255,.88); margin-bottom: 28px; display: inline-flex; align-items: center; gap: 12px; }
.hero-mega .eyebrow::before { content: ''; width: 32px; height: 1px; background: var(--accent); }
.hero-display { font-weight: 800; font-size: clamp(48px, 9vw, 124px); line-height: .92; color: #fff; letter-spacing: -.035em; text-transform: uppercase; max-width: 14ch; margin-bottom: 28px; }
.hero-display .dot { color: var(--accent); }
.hero-mega .lead { font-size: clamp(15px, 1.6vw, 18px); line-height: 1.65; color: rgba(255,255,255,.92); max-width: 580px; margin-bottom: 36px; }
.cta-row { display: flex; gap: 14px; flex-wrap: wrap; }

.btn { display: inline-flex; align-items: center; gap: 10px; padding: 16px 28px; font-size: 11px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; transition: all .2s ease; cursor: pointer; }
.btn-dark { background: var(--ink-900); color: var(--bg); border: 1px solid var(--ink-900); }
.btn-dark:hover { background: var(--accent); border-color: var(--accent); }
.btn-outline { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.6); }
.btn-outline:hover { border-color: #fff; background: rgba(255,255,255,.08); }
.btn-light { background: var(--bg); color: var(--ink-900); border: 1px solid var(--ink-900); }
.btn-light:hover { background: var(--ink-900); color: var(--bg); }
.btn .arrow { font-family: serif; font-size: 13px; transition: transform .25s ease; }
.btn:hover .arrow { transform: translateX(4px); }

section { padding: 100px 0; position: relative; }
section.tight { padding: 64px 0; }
@media (max-width: 720px) { section { padding: 64px 0; } section.tight { padding: 48px 0; } }
.section-label { font-size: 11px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: var(--ink-500); margin-bottom: 18px; display: inline-flex; align-items: center; gap: 12px; }
.section-label::before { content: ''; width: 24px; height: 1px; background: var(--accent); }
h2 { font-weight: 800; font-size: clamp(32px, 5vw, 56px); line-height: .98; letter-spacing: -.025em; text-transform: uppercase; }
h3 { font-weight: 800; font-size: clamp(20px, 2.4vw, 26px); line-height: 1.05; letter-spacing: -.015em; text-transform: uppercase; }
.lead-large { font-size: clamp(17px, 1.8vw, 21px); line-height: 1.55; color: var(--ink-700); max-width: 760px; }

.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); border-top: 1px solid var(--ink-200); border-bottom: 1px solid var(--ink-200); }
.stat { padding: 48px 32px; border-right: 1px solid var(--ink-200); }
.stat:last-child { border-right: 0; }
.stat .label { font-size: 10px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: var(--ink-500); margin-bottom: 16px; }
.stat .value { font-weight: 800; font-size: clamp(54px, 7vw, 88px); line-height: .9; letter-spacing: -.04em; color: var(--ink-900); }
.stat .value .suffix { color: var(--accent); font-size: .55em; vertical-align: top; line-height: 1; margin-left: 4px; }
.stat .caption { font-size: 12px; color: var(--ink-500); margin-top: 12px; line-height: 1.5; max-width: 220px; }
@media (max-width: 720px) { .stat { padding: 32px 22px; border-right: 0; border-bottom: 1px solid var(--ink-200); } .stat:last-child { border-bottom: 0; } }

.bento-propostas { display: grid; grid-template-columns: 1fr; gap: 24px; margin-top: 56px; }
@media (min-width: 900px) { .bento-propostas { grid-template-columns: 1fr 1fr; } }
.proposta-card { position: relative; min-height: 480px; border: 1px solid var(--ink-200); overflow: hidden; display: flex; flex-direction: column; transition: all .35s cubic-bezier(.2,.7,.3,1); }
.proposta-card:hover { border-color: var(--ink-900); transform: translateY(-4px); }
.proposta-card .img-wrap { position: relative; flex: 1; min-height: 280px; overflow: hidden; background: var(--ink-900); }
.proposta-card .img-wrap img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; filter: grayscale(85%) contrast(1.05); transition: all .8s ease; }
.proposta-card:hover .img-wrap img { filter: grayscale(0%) contrast(1); transform: scale(1.04); }
.proposta-card .tag { position: absolute; top: 20px; left: 20px; z-index: 2; background: var(--bg); color: var(--ink-900); padding: 8px 14px; font-size: 10px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; }
.proposta-card .tag.alt { background: var(--accent); color: #fff; }
.proposta-card .body { padding: 32px; background: var(--bg); }
.proposta-card h3 { margin-bottom: 14px; }
.proposta-card p { color: var(--ink-500); font-size: 14px; line-height: 1.65; margin-bottom: 18px; }
.proposta-card .arrow-link { display: inline-flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-900); }
.proposta-card:hover .arrow-link { color: var(--accent); }

.segmentos-grid { display: grid; grid-template-columns: 1fr; gap: 24px; margin-top: 56px; }
@media (min-width: 820px) { .segmentos-grid { grid-template-columns: repeat(3, 1fr); } }
.segmento-card { position: relative; overflow: hidden; min-height: 420px; display: flex; flex-direction: column; justify-content: flex-end; cursor: pointer; transition: transform .4s ease; }
.segmento-card:hover { transform: translateY(-6px); }
.segmento-card .bg-img { position: absolute; inset: 0; z-index: 0; background-size: cover; background-position: center; filter: grayscale(100%) contrast(1.1) brightness(.55); transition: all .6s ease; }
.segmento-card:hover .bg-img { filter: grayscale(40%) contrast(1.05) brightness(.6); transform: scale(1.05); }
.segmento-card::after { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(17,17,17,0) 0%, rgba(17,17,17,.85) 100%); }
.segmento-card .content { position: relative; z-index: 2; padding: 32px; color: #fff; }
.segmento-card .num-tag { font-size: 10px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: var(--accent); margin-bottom: 12px; }
.segmento-card h3 { color: #fff; margin-bottom: 12px; }
.segmento-card p { font-size: 14px; line-height: 1.6; color: rgba(255,255,255,.85); }

.tech-section { background: var(--ink-900); color: #fff; padding: 120px 0; overflow: hidden; }
.tech-section .section-label { color: rgba(255,255,255,.6); }
.tech-section .section-label::before { background: var(--accent); }
.tech-section h2 { color: #fff; max-width: 680px; }
.tech-section .lead-large { color: rgba(255,255,255,.7); margin-top: 22px; }
.tech-grid { display: grid; grid-template-columns: 1fr; gap: 48px; margin-top: 64px; align-items: center; }
@media (min-width: 920px) { .tech-grid { grid-template-columns: 1fr 1.2fr; gap: 80px; } }
.tech-features { display: flex; flex-direction: column; gap: 28px; }
.tech-feature { padding-top: 22px; border-top: 1px solid rgba(255,255,255,.18); }
.tech-feature .ti { font-size: 11px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: var(--accent); margin-bottom: 8px; display: block; }
.tech-feature h4 { font-weight: 800; font-size: 18px; text-transform: uppercase; letter-spacing: -.015em; color: #fff; margin-bottom: 10px; }
.tech-feature p { font-size: 14px; line-height: 1.65; color: rgba(255,255,255,.7); }

.app-mockup { border: 1px solid rgba(255,255,255,.18); background: #1A1A1A; box-shadow: 0 40px 80px -20px rgba(0,0,0,.6); transition: transform .4s ease; }
.app-mockup:hover { transform: translateY(-4px); }
.app-mockup .topbar-fake { display: flex; align-items: center; gap: 6px; padding: 12px 16px; border-bottom: 1px solid rgba(255,255,255,.1); }
.app-mockup .topbar-fake span { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,.2); }
.app-mockup .topbar-fake span:nth-child(1) { background: #FF5F57; }
.app-mockup .topbar-fake span:nth-child(2) { background: #FEBC2E; }
.app-mockup .topbar-fake span:nth-child(3) { background: #28C840; }
.app-mockup .topbar-fake .url { margin-left: 14px; font-size: 11px; color: rgba(255,255,255,.5); font-family: monospace; }
.app-mockup .screen { padding: 24px; background: var(--bg); color: var(--ink-900); min-height: 380px; }
.app-mockup .mock-eyebrow { font-size: 9px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: var(--ink-500); margin-bottom: 6px; }
.app-mockup .mock-title { font-weight: 800; font-size: 24px; letter-spacing: -.02em; text-transform: uppercase; margin-bottom: 22px; }
.app-mockup .mock-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; padding: 18px 0; border-top: 1px solid var(--ink-200); border-bottom: 1px solid var(--ink-200); }
.app-mockup .mock-kpi .l { font-size: 8px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-500); }
.app-mockup .mock-kpi .v { font-weight: 800; font-size: 26px; letter-spacing: -.025em; margin-top: 6px; }
.app-mockup .mock-board { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 18px; }
.app-mockup .mock-col { border-top: 2px solid; padding: 10px 6px; min-height: 100px; }
.app-mockup .mock-col h6 { font-size: 8px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 8px; }
.app-mockup .mock-card { background: var(--bg); border: 1px solid var(--ink-200); padding: 8px; font-size: 10px; font-weight: 500; margin-bottom: 6px; }
.app-mockup .mock-card span { display: block; font-size: 8px; color: var(--ink-500); font-weight: 400; margin-top: 2px; letter-spacing: .08em; text-transform: uppercase; }

.comparativo-rich { display: grid; grid-template-columns: 1fr; gap: 24px; margin-top: 48px; }
@media (min-width: 760px) { .comparativo-rich { grid-template-columns: 1fr 1fr; gap: 32px; } }
.comp-rich-col { padding: 40px 32px; border: 1px solid var(--ink-200); position: relative; transition: border-color .25s; }
.comp-rich-col:hover { border-color: var(--ink-900); }
.comp-rich-col.featured { border-color: var(--accent); }
.comp-rich-col.featured::before { content: 'mais vantajoso'; position: absolute; top: -12px; left: 24px; background: var(--accent); color: #fff; padding: 5px 12px; font-size: 9px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; }
.comp-rich-col .label { font-size: 10px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: var(--ink-500); margin-bottom: 8px; }
.comp-rich-col h4 { font-weight: 800; font-size: 20px; text-transform: uppercase; letter-spacing: -.015em; margin-bottom: 20px; }
.comp-rich-col .big { font-weight: 800; font-size: clamp(36px, 5vw, 52px); letter-spacing: -.04em; line-height: 1; color: var(--ink-900); }
.comp-rich-col.featured .big { color: var(--accent); }
.comp-rich-col .big-cap { font-size: 11px; color: var(--ink-500); margin-top: 10px; letter-spacing: .04em; }
.comp-rich-col .breakdown { list-style: none; margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--ink-200); }
.comp-rich-col .breakdown li { font-size: 13px; padding: 10px 0; display: flex; justify-content: space-between; color: var(--ink-500); border-bottom: 1px solid var(--ink-200); }
.comp-rich-col .breakdown li:last-child { border-bottom: 0; }
.comp-rich-col .breakdown li strong { color: var(--ink-900); font-weight: 500; }

.steps { display: grid; grid-template-columns: 1fr; gap: 0; margin-top: 56px; border-top: 1px solid var(--ink-200); }
.step { padding: 36px 0; border-bottom: 1px solid var(--ink-200); display: grid; grid-template-columns: 80px 1fr; gap: 32px; align-items: start; transition: padding-left .3s ease; }
.step:hover { padding-left: 16px; }
.step .num-big { font-weight: 800; font-size: 38px; letter-spacing: -.03em; color: var(--accent); line-height: 1; }
.step h4 { font-weight: 800; font-size: 18px; text-transform: uppercase; letter-spacing: -.015em; margin-bottom: 8px; }
.step p { color: var(--ink-500); font-size: 14px; line-height: 1.7; max-width: 640px; }
@media (max-width: 600px) { .step { grid-template-columns: 60px 1fr; gap: 16px; padding: 28px 0; } .step .num-big { font-size: 28px; } }

.admins { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.admin-chip { padding: 12px 22px; border: 1px solid var(--ink-200); font-size: 11px; font-weight: 500; letter-spacing: .12em; color: var(--ink-500); background: var(--bg); transition: all .25s ease; }
.admin-chip:hover { border-color: var(--ink-900); color: var(--ink-900); }
.admin-chip.featured { border-color: var(--accent); color: var(--accent); }

.cta-final { background: var(--ink-900); color: var(--bg); padding: 120px 0; text-align: center; position: relative; overflow: hidden; }
.cta-final::before { content: ''; position: absolute; inset: 0; background-image: url('https://images.unsplash.com/photo-1497366216548-37526070297c?w=2000&q=80&auto=format&fit=crop'); background-size: cover; background-position: center; filter: grayscale(100%) contrast(1.1) brightness(.18); opacity: .5; }
.cta-final .wrap { position: relative; z-index: 2; }
.cta-final .section-label { color: rgba(255,255,255,.6); display: block; }
.cta-final .section-label::before { background: var(--accent); }
.cta-final h2 { color: #fff; max-width: 720px; margin: 0 auto 24px; }
.cta-final p { color: rgba(255,255,255,.75); margin-bottom: 40px; font-size: 16px; }
.wa-cta { display: inline-flex; align-items: center; gap: 18px; background: var(--accent); color: #fff; padding: 22px 38px; font-size: 12px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; transition: all .25s ease; }
.wa-cta:hover { background: #fff; color: var(--ink-900); }
.wa-cta .num { font-size: 16px; letter-spacing: .02em; font-weight: 500; text-transform: none; }

footer { background: var(--ink-900); color: var(--bg); padding: 64px 0 28px; }
.footer-grid { display: grid; grid-template-columns: 1fr; gap: 32px; padding-bottom: 40px; border-bottom: 1px solid rgba(255,255,255,.12); }
@media (min-width: 700px) { .footer-grid { grid-template-columns: 2fr 1fr 1fr 1fr; gap: 48px; } }
footer .col .heading { display: block; font-size: 10px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; color: rgba(255,255,255,.5); margin-bottom: 16px; }
footer .col { font-size: 13px; line-height: 2; color: rgba(255,255,255,.65); }
footer .col a:hover { color: #fff; }
footer .col.brand-col .brand { color: #fff; }
footer .col.brand-col .brand-mark { filter: invert(1); }
footer .col.brand-col p { margin-top: 16px; font-size: 13px; color: rgba(255,255,255,.6); max-width: 280px; }
.footer-line { display: inline-block; width: 24px; height: 1px; background: var(--accent); margin: 14px 0; }
.footer-bottom { display: flex; justify-content: space-between; padding-top: 24px; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.4); flex-wrap: wrap; gap: 8px; }

.reveal { opacity: 0; transform: translateY(28px); transition: opacity .9s ease, transform .9s cubic-bezier(.2,.7,.3,1); }
.reveal.in { opacity: 1; transform: translateY(0); }
.reveal.from-left { transform: translateX(-28px); }
.reveal.from-left.in { transform: translateX(0); }
.reveal.from-right { transform: translateX(28px); }
.reveal.from-right.in { transform: translateX(0); }
.reveal[data-delay="1"] { transition-delay: .12s; }
.reveal[data-delay="2"] { transition-delay: .24s; }
.reveal[data-delay="3"] { transition-delay: .36s; }
.reveal[data-delay="4"] { transition-delay: .48s; }
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1; transform: none; transition: none; } html { scroll-behavior: auto; } }

.form-rich { display: flex; flex-direction: column; gap: 28px; margin-top: 48px; }
.form-row { display: grid; grid-template-columns: 1fr; gap: 28px; }
@media (min-width: 600px) { .form-row { grid-template-columns: 1fr 1fr; } }
.field-rich label { display: block; font-size: 10px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--ink-500); margin-bottom: 10px; }
.field-rich input, .field-rich select, .field-rich textarea { width: 100%; padding: 14px 0; background: transparent; border: 0; border-bottom: 1px solid var(--ink-300); color: var(--ink-900); font-family: inherit; font-size: 16px; font-weight: 400; transition: border-color .25s ease; }
.field-rich input:focus, .field-rich select:focus, .field-rich textarea:focus { outline: 0; border-bottom-color: var(--accent); }
.field-rich select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--ink-500) 50%), linear-gradient(135deg, var(--ink-500) 50%, transparent 50%); background-position: calc(100% - 12px) 50%, calc(100% - 7px) 50%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 28px; }

.accent-bar { display: inline-block; width: 40px; height: 2px; background: var(--accent); }
