:root {
  --primary: #22c55e;
  --primary-strong: #16a34a;
  --primary-soft: #dcfce7;
  --background: #f8fafc;
  --surface: #ffffff;
  --surface-muted: #f1f5f9;
  --foreground: #0f172a;
  --muted: #64748b;
  --border: #e2e8f0;
  --radius: 8px;
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, .05);
  --shadow-lg: 0 20px 45px rgba(15, 23, 42, .10);
}

@font-face {
  font-family: "Font Awesome 6 Free";
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("fa-solid-900.woff2") format("woff2");
}

.fas {
  display: inline-block;
  font-family: "Font Awesome 6 Free";
  font-style: normal;
  font-weight: 900;
  line-height: 1;
}

.fa-moon::before { content: "\f186"; }
.fa-sun::before { content: "\f185"; }
.fa-bars::before { content: "\f0c9"; }
.fa-times::before { content: "\f00d"; }
.fa-arrow-right::before { content: "\f061"; }
.fa-headset::before { content: "\f590"; }
.fa-users::before { content: "\f0c0"; }
.fa-chart-line::before { content: "\f201"; }
.fa-plug::before { content: "\f1e6"; }
.fa-check::before { content: "\f00c"; }

html.dark {
  --primary-soft: #123c24;
  --background: #0c0b0a;
  --surface: #191715;
  --surface-muted: #262321;
  --foreground: #f2f2f2;
  --muted: #a8a29e;
  --border: #38332f;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .35);
  --shadow-lg: 0 20px 45px rgba(0, 0, 0, .35);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body { min-width: 320px; overflow-x: hidden; background: var(--background); color: var(--foreground); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height: 1.6; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
button { font: inherit; }
.container { width: min(100% - 40px, 1180px); margin: 0 auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

header { position: fixed; inset: 0 0 auto; z-index: 1000; height: 72px; display: flex; align-items: center; border-bottom: 1px solid var(--border); background: color-mix(in srgb, var(--surface) 92%, transparent); backdrop-filter: blur(14px); }
header .container { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.logo { display: flex; align-items: center; gap: 10px; flex-shrink: 0; color: var(--foreground); font-size: 1.125rem; font-weight: 700; letter-spacing: -.025em; }
.logo img { width: 42px; height: 42px; object-fit: contain; }
nav ul { display: flex; align-items: center; gap: 4px; }
nav a { display: inline-flex; align-items: center; height: 38px; padding: 0 12px; border-radius: 6px; color: var(--muted); font-size: .875rem; font-weight: 500; transition: color .2s, background .2s; }
nav a:hover { color: var(--foreground); background: var(--surface-muted); }
.header-actions { display: flex; align-items: center; gap: 4px; }
.theme-toggle, .menu-mobile-btn { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: var(--muted); cursor: pointer; transition: background .2s, color .2s; }
.theme-toggle:hover, .menu-mobile-btn:hover { background: var(--surface-muted); color: var(--foreground); }
.menu-mobile-btn, .overlay { display: none; }

.hero { position: relative; overflow: hidden; padding: 154px 0 92px; background: linear-gradient(120deg, var(--surface) 0%, color-mix(in srgb, var(--primary-soft) 72%, var(--background)) 53%, var(--background) 100%); }
.hero::before { content: ""; position: absolute; width: 540px; height: 540px; right: -180px; top: -240px; border-radius: 50%; background: color-mix(in srgb, var(--primary) 12%, transparent); }
.hero .container { position: relative; display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 64px; }
.eyebrow, .section-kicker { margin-bottom: 14px; color: var(--primary-strong); font-size: .6875rem; font-weight: 700; letter-spacing: .1em; }
.hero h1 { max-width: 690px; margin-bottom: 20px; color: var(--foreground); font-size: clamp(2.35rem, 5vw, 4.25rem); font-weight: 700; letter-spacing: -.055em; line-height: 1.06; }
.hero p:not(.eyebrow) { max-width: 610px; margin-bottom: 30px; color: var(--muted); font-size: 1.08rem; line-height: 1.7; }
.cta-buttons { display: flex; flex-wrap: wrap; gap: 12px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 10px 18px; border: 1px solid transparent; border-radius: var(--radius); font-size: .875rem; font-weight: 600; transition: background .2s, border-color .2s, color .2s, transform .2s, box-shadow .2s; }
.btn:hover { transform: translateY(-1px); }
.btn-primary { background: var(--primary); color: #fff; box-shadow: 0 4px 12px rgba(34, 197, 94, .22); }
.btn-primary:hover { background: var(--primary-strong); color: #fff; box-shadow: 0 8px 18px rgba(34, 197, 94, .26); }
.btn-secondary { border-color: var(--border); background: var(--surface); color: var(--foreground); }
.btn-secondary:hover { border-color: color-mix(in srgb, var(--border) 70%, var(--foreground)); background: var(--surface-muted); color: var(--foreground); box-shadow: var(--shadow-sm); }
.hero-image { position: relative; }
.hero-image::before { content: "Visão completa da operação"; position: absolute; z-index: 2; left: -22px; bottom: 26px; padding: 9px 13px; border: 1px solid var(--border); border-radius: 7px; background: var(--surface); color: var(--foreground); box-shadow: var(--shadow-lg); font-size: .75rem; font-weight: 600; }
.hero-image img { width: 100%; border: 1px solid var(--border); border-radius: 12px; box-shadow: var(--shadow-lg); filter: saturate(.9); }

section:not(.hero) { padding: 96px 0; }
.section-kicker, .section-title, .section-intro { text-align: center; }
.section-title { max-width: 760px; margin: 0 auto 14px; color: var(--foreground); font-size: clamp(1.9rem, 3.8vw, 2.65rem); font-weight: 700; letter-spacing: -.045em; line-height: 1.15; }
.section-intro { max-width: 690px; margin: 0 auto 42px; color: var(--muted); font-size: 1rem; }
.benefits { background: var(--surface); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.benefits-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.benefit-card, .service-card { border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-sm); transition: border-color .2s, box-shadow .2s, transform .2s; }
.benefit-card { padding: 24px; }
.benefit-card:hover, .service-card:hover { border-color: color-mix(in srgb, var(--primary) 52%, var(--border)); box-shadow: var(--shadow-lg); transform: translateY(-3px); }
.benefit-card i { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; margin-bottom: 18px; border-radius: 7px; background: var(--primary-soft); color: var(--primary-strong); font-size: 1.15rem; }
.benefit-card h3, .service-card h3 { margin-bottom: 8px; color: var(--foreground); font-size: 1rem; font-weight: 650; }
.benefit-card p, .service-card p { color: var(--muted); font-size: .875rem; line-height: 1.65; }
.services { background: var(--background); }
.services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.service-card { overflow: hidden; }
.service-card img { width: 100%; height: 190px; object-fit: cover; filter: saturate(.75); }
.service-card h3 { padding: 22px 22px 0; }
.service-card p { padding: 8px 22px 24px; }

.pricing { border-top: 1px solid var(--border); background: var(--surface); }
.pricing-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; align-items: stretch; }
.pricing-card { position: relative; display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); box-shadow: var(--shadow-sm); }
.pricing-card.featured { border: 2px solid var(--primary); box-shadow: 0 12px 30px color-mix(in srgb, var(--primary) 14%, transparent); }
.pricing-badge { position: absolute; top: 16px; right: 16px; padding: 4px 8px; border-radius: 999px; background: var(--primary-soft); color: var(--primary-strong); font-size: .6875rem; font-weight: 700; }
.pricing-header { padding: 28px 26px 20px; border-bottom: 1px solid var(--border); background: var(--surface-muted); }
.featured .pricing-header { background: color-mix(in srgb, var(--primary-soft) 62%, var(--surface)); }
.pricing-header h3 { margin-bottom: 10px; color: var(--foreground); font-size: 1.125rem; }
.pricing-header > p:last-child { color: var(--muted); font-size: .8125rem; }
.price { margin-bottom: 12px; color: var(--foreground); font-size: 2rem; font-weight: 700; letter-spacing: -.04em; line-height: 1; }
.price span { color: var(--muted); font-size: .8125rem; font-weight: 500; letter-spacing: 0; }
.pricing-features { display: grid; flex: 1; gap: 12px; padding: 24px 26px; }
.pricing-features li { display: flex; align-items: flex-start; gap: 9px; color: var(--muted); font-size: .875rem; line-height: 1.45; }
.pricing-features i { margin-top: 3px; color: var(--primary-strong); font-size: .75rem; }
.pricing-card .btn { align-self: stretch; margin: 0 26px 26px; }

.contact { background: var(--surface); border-top: 1px solid var(--border); }
.contact .container { display: grid; grid-template-columns: .85fr 1.15fr; gap: 72px; align-items: start; }
.contact-content .section-kicker, .contact-content .section-title, .contact-content .section-intro { text-align: left; }
.contact-content .section-title { margin-left: 0; }
.contact-content .section-intro { margin-left: 0; margin-bottom: 0; }
#contact-form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding: 28px; border: 1px solid var(--border); border-radius: 12px; background: var(--background); box-shadow: var(--shadow-sm); }
.form-group { display: grid; gap: 6px; }
.form-group-full, .form-status, .form-disclaimer { grid-column: 1 / -1; }
.form-group label { color: var(--foreground); font-size: .8125rem; font-weight: 600; }
.form-group label span { color: var(--muted); font-weight: 400; }
.form-group input, .form-group textarea { width: 100%; min-height: 42px; padding: 9px 11px; border: 1px solid var(--border); border-radius: 6px; outline: none; background: var(--surface); color: var(--foreground); font: inherit; font-size: .875rem; transition: border-color .2s, box-shadow .2s; }
.form-group textarea { min-height: 108px; resize: vertical; }
.form-group input:focus, .form-group textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 18%, transparent); }
.form-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
#contact-form .btn { justify-self: start; }
#contact-form .btn:disabled { cursor: wait; opacity: .65; transform: none; }
.form-status { min-height: 1.5em; color: var(--muted); font-size: .875rem; }
.form-status[data-state="success"] { color: var(--primary-strong); }
.form-status[data-state="error"] { color: #dc2626; }
.form-disclaimer { color: var(--muted); font-size: .75rem; }

footer { padding: 56px 0 24px; background: #0f172a; color: #cbd5e1; }
.footer-content { display: grid; grid-template-columns: 1.4fr 1fr; gap: 48px; padding-bottom: 40px; }
.footer-logo img { width: 48px; height: 48px; margin-bottom: 12px; }
.footer-logo h2 { margin-bottom: 6px; color: #fff; font-size: 1.1rem; }
.footer-logo p { max-width: 300px; color: #94a3b8; font-size: .875rem; }
.footer-links h3 { margin-bottom: 14px; color: #fff; font-size: .875rem; }
.footer-links li + li { margin-top: 9px; }
.footer-links a { color: #94a3b8; font-size: .8125rem; }
.footer-links a:hover { color: #fff; }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-top: 22px; border-top: 1px solid #334155; color: #94a3b8; font-size: .75rem; }

@media (max-width: 960px) {
  .hero .container { grid-template-columns: 1fr; gap: 42px; }
  .hero-content { text-align: center; } .hero h1, .hero p:not(.eyebrow) { margin-left: auto; margin-right: auto; } .cta-buttons { justify-content: center; }
  .hero-image { max-width: 620px; margin: 0 auto; } .benefits-grid { grid-template-columns: repeat(2, 1fr); }
  .contact .container { grid-template-columns: 1fr; gap: 34px; } .pricing-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
  header { height: 64px; } .container { width: min(100% - 32px, 1180px); } .logo img { width: 38px; height: 38px; }
  .menu-mobile-btn { display: inline-flex; } nav { position: fixed; top: 64px; right: 0; width: min(320px, 88vw); height: calc(100svh - 64px); padding: 20px; border-left: 1px solid var(--border); background: var(--surface); box-shadow: var(--shadow-lg); transform: translateX(100%); transition: transform .25s ease; }
  nav.active { transform: translateX(0); } nav ul { width: 100%; flex-direction: column; align-items: stretch; gap: 4px; } nav a { width: 100%; height: 44px; }
  .overlay.active { display: block; position: fixed; inset: 0; z-index: 999; background: rgba(15, 23, 42, .48); }
  .hero { padding: 120px 0 64px; } .hero .container { gap: 38px; } .hero-image::before { left: 10px; bottom: 14px; } section:not(.hero) { padding: 64px 0; }
  .services-grid, .pricing-grid { grid-template-columns: 1fr; } .footer-content { grid-template-columns: 1fr 1fr; gap: 34px; }
}
@media (max-width: 520px) {
  .hero h1 { font-size: 2.25rem; } .hero p:not(.eyebrow) { font-size: 1rem; } .cta-buttons, .cta-buttons .btn { width: 100%; }
  .benefits-grid, #contact-form { grid-template-columns: 1fr; } .form-group-full, .form-status, .form-disclaimer { grid-column: auto; } #contact-form .btn { width: 100%; } .benefits-grid { grid-template-columns: 1fr; } .footer-content, .footer-bottom { grid-template-columns: 1fr; } .footer-bottom { align-items: flex-start; flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; } }