:root {
  --pp-primary: #1F80A6;
  --pp-bg: #FFFFFF;
  --pp-cta: #96c322;
  --pp-muted: #F1F1F1;
  --pp-text: #1f2a37;
}

html, body {
  font-family: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif;
  color: var(--pp-text);
  background: var(--pp-bg);
}

.text-primary { color: var(--pp-primary) !important; }
.bg-primary { background-color: var(--pp-primary) !important; }

/* CTA */
.btn-cta {
  background: var(--pp-cta);
  color: #0f2a00;
  border: 1px solid color-mix(in srgb, var(--pp-cta) 80%, #000 20%);
}
.btn-cta:hover, .btn-cta:focus {
  background: color-mix(in srgb, var(--pp-cta) 92%, #000 8%);
  color: #0f2a00;
}
.bg-cta-subtle { background: color-mix(in srgb, var(--pp-cta) 15%, #fff 85%); }
.text-cta { color: color-mix(in srgb, var(--pp-cta) 80%, #2b2b2b 20%); }

/* Hero */
.hero {
  background: radial-gradient(1200px 600px at 10% -10%, rgba(150,195,34,0.25), transparent 60%),
              linear-gradient(135deg, #176387 0%, var(--pp-primary) 55%, #0f4f6a 100%);
}
.hero .hero-card { border-radius: 1rem; }
.hero .kpi { display: grid; }
.hero .kpi-label { font-size: .85rem; color: #6ea7bf; text-transform: uppercase; letter-spacing: .04em; }
.hero .kpi-value { font-size: 1.75rem; font-weight: 700; color: var(--pp-primary); }

/* Sections */
section { scroll-margin-top: 90px; }
.bg-light { background: var(--pp-muted) !important; }

.feature .card-title { color: var(--pp-primary); }
.feature .card { border: 0; border-radius: .75rem; }
.feature .card-body { transition: transform 220ms ease, box-shadow 220ms ease; }
.feature .card:hover .card-body { transform: translateY(-2px); box-shadow: 0 8px 26px rgba(0,0,0,.06); }

/* Feature icons */
.feature-icon {
  width: 56px; height: 56px;
  display: flex; align-items: center; justify-content: center;
  margin-left: auto; margin-right: auto;
  border-radius: 12px;
  color: var(--pp-primary);
  background: color-mix(in srgb, var(--pp-primary) 8%, #fff 92%);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--pp-primary) 22%, #ffffff 78%);
  transition: background 220ms ease, color 220ms ease, transform 220ms ease;
}
.feature .card:hover .feature-icon { 
  color: #0f2a00;
  background: color-mix(in srgb, var(--pp-cta) 35%, #fff 65%);
  transform: scale(1.03);
}

/* Integration icons */
.integration-icon {
  width: 48px; height: 48px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 10px; margin-bottom: .25rem;
  color: var(--pp-primary);
  background: color-mix(in srgb, var(--pp-primary) 8%, #fff 92%);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--pp-primary) 22%, #ffffff 78%);
  transition: background 220ms ease, color 220ms ease, transform 220ms ease;
}
.card:hover .integration-icon {
  color: #0f2a00;
  background: color-mix(in srgb, var(--pp-cta) 35%, #fff 65%);
  transform: translateY(-1px);
}

/* Pricing */
.pricing-card { border-radius: 1rem; }
.pricing-card.highlight { outline: 2px solid color-mix(in srgb, var(--pp-primary) 35%, #fff 65%); }
.pricing-list li { position: relative; padding-left: 28px; }
.pricing-list li.ok::before { content: ''; position: absolute; left: 0; top: .2rem; width: 18px; height: 18px; border-radius: 6px; background: color-mix(in srgb, var(--pp-primary) 12%, #fff 88%); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--pp-primary) 25%, #fff 75%); }
.pricing-list li.ok::after { content: ''; position: absolute; left: 5px; top: .6rem; width: 8px; height: 4px; border: 2px solid var(--pp-primary); border-top: 0; border-right: 0; transform: rotate(-45deg); }
.pricing-list li.plus::before { content: '+'; position: absolute; left: 0; top: .05rem; width: 18px; height: 18px; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: .9rem; color: #0f2a00; background: color-mix(in srgb, var(--pp-cta) 35%, #fff 65%); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--pp-cta) 60%, #fff 40%); }

.cta-band { background: linear-gradient(90deg, var(--pp-primary), #0f4f6a); border-top: 1px solid rgba(255,255,255,.1); border-bottom: 1px solid rgba(255,255,255,.1); }

/* Footer */
footer { background: #fff; }

/* Utilities */
.py-lg-6 { padding-top: 5rem !important; padding-bottom: 5rem !important; }

@media (max-width: 575.98px) {
  .display-5 { font-size: 2rem; }
}

/* Reveal on load */
.reveal-on-load { opacity: 0; transform: translateY(12px); transition: opacity 900ms ease, transform 900ms ease; }
.reveal-on-load.is-visible { opacity: 1; transform: none; }

/* Respeita usuários com redução de movimento */
@media (prefers-reduced-motion: reduce) {
  .reveal-on-load { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* PCP Section */
.pcp-flow .pcp-steps { scrollbar-width: thin; }
.pcp-flow .pcp-step { white-space: nowrap; border-radius: 9999px; border: 1px solid var(--pp-muted); }
.pcp-flow .pcp-step.active { background: var(--pp-cta); color: #0f2a00; border-color: color-mix(in srgb, var(--pp-cta) 80%, #000 20%); }
.pcp-graphic-canvas { position: relative; height: 180px; background: linear-gradient(180deg, #ffffff, #fafafa); border-radius: 12px; }
.pcp-node { position: absolute; padding: .5rem .75rem; background: #fff; border-radius: .5rem; box-shadow: 0 6px 18px rgba(0,0,0,.06); border: 1px solid var(--pp-muted); font-weight: 600; color: var(--pp-primary); }
.pcp-node::after { content: ''; position: absolute; width: 28px; height: 2px; background: color-mix(in srgb, var(--pp-primary) 60%, #000 40%); top: 50%; right: -28px; transform: translateY(-50%); }
.pcp-node:last-child::after { display: none; }
.pcp-graphic-canvas .node-a { left: 16px; top: 30%; }
.pcp-graphic-canvas .node-b { left: 140px; top: 55%; }
.pcp-graphic-canvas .node-c { left: 260px; top: 30%; }
.pcp-graphic-canvas .node-d { left: 380px; top: 55%; }

@media (max-width: 575.98px) {
  .pcp-graphic-canvas { height: 140px; }
  .pcp-graphic-canvas .node-b { left: 120px; }
  .pcp-graphic-canvas .node-c { left: 220px; }
  .pcp-graphic-canvas .node-d { left: 320px; }
}

/* WhatsApp Float */
.whatsapp-float {
  position: fixed; right: 20px; bottom: 20px; z-index: 1050;
  width: 56px; height: 56px; border-radius: 50%;
  background: #25D366; color: #053b1c;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 12px 30px rgba(0,0,0,.18);
  transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease;
}
.whatsapp-float:hover { transform: translateY(-2px) scale(1.03); box-shadow: 0 16px 36px rgba(0,0,0,.22); }
@media (max-width: 575.98px) { .whatsapp-float { right: 14px; bottom: 14px; width: 52px; height: 52px; } }

/* Dark band - sobre PCP */
.band-dark { 
  background: radial-gradient(1000px 500px at 10% -10%, rgba(150,195,34,0.15), transparent 60%),
              linear-gradient(135deg, #0e3750 0%, #0b2a3d 60%, #071c29 100%);
}
.band-dark .benefit-icon { 
  width: 48px; height: 48px; display: inline-flex; align-items: center; justify-content: center; 
  color: var(--pp-primary); border-radius: 12px; 
  background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 1px rgba(255,255,255,.1);
}

/* Cloud Section */
.cloud-section {
  background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 50%, #dee2e6 100%);
}
.cloud-card { 
  border-radius: 1rem; 
  background: #fff;
}
.cloud-badge {
  display: inline-flex; align-items: center; justify-content: center;
  width: 100px; height: 100px; border-radius: 50%;
  background: linear-gradient(135deg, color-mix(in srgb, var(--pp-primary) 12%, #fff 88%), color-mix(in srgb, var(--pp-primary) 8%, #fff 92%));
  color: var(--pp-primary);
  box-shadow: 0 8px 24px rgba(31,128,166,.15);
  margin: 0 auto;
}
.cloud-visual { padding: 2rem 0; }

/* ERP band (soluções) */
.erp-band {
  background: linear-gradient(135deg, #0e3750 0%, #14526e 60%, #1F80A6 100%);
}
.erp-card { backdrop-filter: blur(2px); }
.erp-tile { background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); }

/* Navbar Moderno */
.navbar {
  transition: background 0.3s ease, backdrop-filter 0.3s ease, box-shadow 0.3s ease;
}
.navbar.scrolled {
  background: rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}
.navbar-brand {
  transition: transform 0.3s ease;
}
.navbar-brand:hover {
  transform: scale(1.05);
}
.navbar-brand img {
  transition: filter 0.3s ease, transform 0.3s ease;
}
.navbar-brand:hover img {
  filter: brightness(1.1);
}

/* Orbit - Ecossistema ProduçãoPro */
.orbit-section { position: relative; }
.orbit-wrap { position: relative; width: 100%; max-width: 560px; aspect-ratio: 1/1; margin: 0 auto; }
.orbit { position: absolute; inset: 0; border-radius: 50%; border: 1px dashed rgba(31,128,166,.25); animation: orbit-rotate 28s linear infinite; }
.orbit::after { content: ''; position: absolute; inset: 8%; border: 1px dashed rgba(31,128,166,.18); border-radius: 50%; }
.orbit-center { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 140px; height: 140px; border-radius: 50%; background: linear-gradient(135deg, #1F80A6, #14526e); color: #fff; display: grid; place-items: center; text-align: center; box-shadow: 0 10px 30px rgba(0,0,0,.15); }
.orbit-center .brand { font-weight: 700; letter-spacing: .2px; }
.orbit-item { position: absolute; width: 108px; height: 108px; border-radius: 50%; background: #fff; box-shadow: 0 12px 30px rgba(0,0,0,.1); display: grid; place-items: center; text-align: center; padding: .5rem; border: 1px solid var(--pp-muted); transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; cursor: pointer; }
.orbit-item:hover { transform: scale(1.06); box-shadow: 0 16px 40px rgba(0,0,0,.14); border-color: color-mix(in srgb, var(--pp-primary) 40%, #000 60%); }
.orbit-item .label { font-size: .8rem; font-weight: 600; color: var(--pp-text); }

/* 8 posições em círculo */
.orbit-item.pos-1 { inset: 2% auto auto 50%; transform: translate(-50%, 0); }
.orbit-item.pos-2 { inset: 15% 10% auto auto; }
.orbit-item.pos-3 { inset: 50% 0 auto auto; transform: translate(0, -50%); }
.orbit-item.pos-4 { inset: auto 10% 15% auto; }
.orbit-item.pos-5 { inset: auto auto 2% 50%; transform: translate(-50%, 0); }
.orbit-item.pos-6 { inset: auto auto 15% 10%; }
.orbit-item.pos-7 { inset: 50% auto auto 0; transform: translate(0, -50%); }
.orbit-item.pos-8 { inset: 15% auto auto 10%; }

@keyframes orbit-rotate {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
  .orbit { animation: none; }
}

/* Nav Links Modernos */
.nav-link {
  position: relative;
  padding: 0.5rem 1rem !important;
  transition: color 0.3s ease, transform 0.2s ease;
  font-weight: 500;
}
.nav-link::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0;
  height: 2px;
  background: var(--pp-primary);
  transform: translateX(-50%);
  transition: width 0.3s ease, background 0.3s ease;
}
.nav-link:hover::before,
.nav-link.active::before {
  width: 80%;
}
.nav-link:hover {
  color: var(--pp-primary) !important;
  transform: translateY(-2px);
}
.nav-link.active {
  color: var(--pp-primary) !important;
}

/* Botão CTA no Nav */
.navbar .btn-cta {
  position: relative;
  overflow: hidden;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  font-weight: 600;
  padding: 0.5rem 1.5rem;
}
.navbar .btn-cta::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.3);
  transform: translate(-50%, -50%);
  transition: width 0.6s ease, height 0.6s ease;
}
.navbar .btn-cta:hover::before {
  width: 300px;
  height: 300px;
}
.navbar .btn-cta:hover {
  transform: translateY(-2px) scale(1.05);
  box-shadow: 0 8px 24px rgba(150, 195, 34, 0.4);
}

/* Navbar Toggler Moderno */
.navbar-toggler {
  border: none;
  padding: 0.25rem 0.5rem;
  transition: transform 0.3s ease;
}
.navbar-toggler:focus {
  box-shadow: 0 0 0 0.2rem rgba(31, 128, 166, 0.25);
}
.navbar-toggler:hover {
  transform: scale(1.1);
}
.navbar-toggler-icon {
  transition: transform 0.3s ease;
}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon {
  transform: rotate(90deg);
}

/* Mobile Nav */
@media (max-width: 991.98px) {
  .navbar-collapse {
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(10px);
    margin-top: 1rem;
    padding: 1rem;
    border-radius: 0.75rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  }
  .nav-link::before {
    display: none;
  }
  .nav-link:hover {
    transform: translateX(8px);
    padding-left: 1.5rem !important;
  }
  .navbar .btn-cta {
    width: 100%;
    margin-top: 0.5rem;
  }
}