import { createHotContext as __vite__createHotContext } from "/@vite/client";import.meta.hot = __vite__createHotContext("/styles.css");import { updateStyle as __vite__updateStyle, removeStyle as __vite__removeStyle } from "/@vite/client"
const __vite__id = "/app/applet/styles.css"
const __vite__css = "/* ==========================================================================\n   SIGMA CONNECT — OFFICIAL SYSTEM STYLES (REDESIGN ULTRA-MODERNO 2026)\n   Aesthetic: Premium, Technological, High-Density, Glassmorphism, Modern B2B Studio\n   ========================================================================== */\n\n/* --- CSS VARIABLES & THEMING --- */\n:root {\n  /* Color Palette - Deep Obsidian & Electric Violet */\n  --bg-deep: #030509;\n  --bg-surface: #080c16;\n  --bg-card: #0f1526;\n  --bg-card-hover: #161e36;\n  --bg-panel: rgba(15, 21, 38, 0.75);\n  --bg-glass: rgba(255, 255, 255, 0.03);\n  \n  --text-primary: #f8fafc;\n  --text-secondary: #94a3b8;\n  --text-muted: #64748b;\n  \n  --accent-purple: #8b3cff;        /* Tom oficial idêntico ao Logotipo */\n  --accent-purple-light: #a865ff;\n  --accent-purple-glow: rgba(139, 60, 255, 0.35);\n  --accent-blue: #4f46e5;\n  --accent-cyan: #38bdf8;\n  --accent-green: #10b981;\n  --accent-gold: #f59e0b;\n  \n  --border-subtle: rgba(255, 255, 255, 0.08);\n  --border-glass: rgba(255, 255, 255, 0.12);\n  --border-glow: rgba(139, 60, 255, 0.32);\n  --border-cyan: rgba(56, 189, 248, 0.28);\n  \n  --shadow-card: 0 16px 40px rgba(0, 0, 0, 0.45);\n  --shadow-glow: 0 0 50px rgba(139, 60, 255, 0.2);\n  --shadow-cyan: 0 0 35px rgba(56, 189, 248, 0.15);\n  \n  /* Fonts & Spacing */\n  --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;\n  --font-mono: 'JetBrains Mono', 'SF Mono', Consolas, monospace;\n  \n  --radius-sm: 8px;\n  --radius-md: 14px;\n  --radius-lg: 20px;\n  --radius-xl: 28px;\n  --radius-full: 9999px;\n  \n  --transition-fast: 0.18s cubic-bezier(0.16, 1, 0.3, 1);\n  --transition-normal: 0.28s cubic-bezier(0.16, 1, 0.3, 1);\n  --transition-slow: 0.45s cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n/* --- RESET & BASE STYLES --- */\n*, *::before, *::after {\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n}\n\nhtml {\n  font-family: var(--font-sans);\n  font-size: 16px;\n  line-height: 1.6;\n  color: var(--text-primary);\n  background-color: var(--bg-deep);\n  scroll-behavior: smooth;\n  -webkit-text-size-adjust: 100%;\n  overflow-x: hidden;\n}\n\nbody {\n  overflow-x: hidden;\n  min-height: 100vh;\n  display: flex;\n  flex-direction: column;\n  background-color: var(--bg-deep);\n  background-image: \n    radial-gradient(circle at 50% 0%, rgba(139, 60, 255, 0.12) 0%, transparent 60%),\n    radial-gradient(circle at 85% 30%, rgba(56, 189, 248, 0.08) 0%, transparent 50%);\n  background-attachment: fixed;\n}\n\n/* Accessibility Focus States */\na, button, input, select, textarea {\n  outline: none;\n}\n\na:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {\n  outline: 2px solid var(--accent-cyan);\n  outline-offset: 3px;\n  border-radius: 6px;\n}\n\n/* Typography Helpers */\nh1, h2, h3, h4, h5, h6 {\n  color: var(--text-primary);\n  line-height: 1.2;\n  font-weight: 800;\n  letter-spacing: -0.03em;\n}\n\np {\n  color: var(--text-secondary);\n}\n\na {\n  color: inherit;\n  text-decoration: none;\n  transition: color var(--transition-fast);\n}\n\nul {\n  list-style: none;\n}\n\nimg, svg {\n  max-width: 100%;\n  display: block;\n}\n\n/* Gradients & Text Effects */\n.text-gradient {\n  background: linear-gradient(135deg, #ffffff 20%, #c4b5fd 65%, #38bdf8 100%);\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  background-clip: text;\n}\n\n.text-accent { color: var(--accent-purple-light); }\n.text-green { color: var(--accent-green); }\n.text-cyan { color: var(--accent-cyan); }\n.text-gold { color: var(--accent-gold); }\n\n/* Layout Containers */\n.container {\n  width: 100%;\n  max-width: 1280px;\n  margin-left: auto;\n  margin-right: auto;\n  padding-left: 24px;\n  padding-right: 24px;\n}\n\n.container-narrow {\n  max-width: 920px;\n}\n\n.section {\n  padding-top: 100px;\n  padding-bottom: 100px;\n  position: relative;\n}\n\n.section-dark {\n  background-color: var(--bg-surface);\n  border-top: 1px solid var(--border-subtle);\n  border-bottom: 1px solid var(--border-subtle);\n  position: relative;\n}\n\n.section-dark::before {\n  content: '';\n  position: absolute;\n  inset: 0;\n  background-image: radial-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px);\n  background-size: 32px 32px;\n  pointer-events: none;\n  opacity: 0.6;\n}\n\n.section-header {\n  margin-bottom: 64px;\n  position: relative;\n  z-index: 2;\n}\n\n.text-center { text-align: center; }\n\n.section-tag {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  font-family: var(--font-mono);\n  font-size: 0.75rem;\n  font-weight: 700;\n  letter-spacing: 0.12em;\n  text-transform: uppercase;\n  color: var(--accent-cyan);\n  background: rgba(56, 189, 248, 0.08);\n  border: 1px solid var(--border-cyan);\n  padding: 5px 16px;\n  border-radius: var(--radius-full);\n  margin-bottom: 18px;\n  box-shadow: 0 0 16px rgba(56, 189, 248, 0.1);\n}\n\n.section-title {\n  font-size: clamp(2rem, 3.5vw, 2.75rem);\n  margin-bottom: 18px;\n  letter-spacing: -0.03em;\n}\n\n.section-subtitle {\n  font-size: 1.15rem;\n  color: var(--text-secondary);\n  max-width: 720px;\n  margin-left: auto;\n  margin-right: auto;\n  line-height: 1.6;\n}\n\n/* Grid System */\n.grid {\n  display: grid;\n  gap: 28px;\n}\n\n.grid-2 { grid-template-columns: repeat(2, 1fr); }\n.grid-3 { grid-template-columns: repeat(3, 1fr); }\n.grid-4 { grid-template-columns: repeat(4, 1fr); }\n\n/* --- OFFICIAL BRAND LOGO (SEM FUNDO / TRANSPARENTE) --- */\n.brand { \n  width: 184px; \n  flex: 0 0 184px; \n  display: block; \n}\n\n.brand-image { \n  display: flex; \n  align-items: center; \n  justify-content: flex-start; \n  width: 184px; \n  height: 52px; \n  padding: 0; \n  overflow: visible; \n  border: none; \n  border-radius: 0; \n  background: transparent; \n  box-shadow: none; \n  transition: transform var(--transition-fast), filter var(--transition-fast);\n}\n\n.brand:hover .brand-image {\n  transform: translateY(-1px);\n  filter: drop-shadow(0 4px 16px rgba(139, 60, 255, 0.55));\n}\n\n.brand-image img { \n  width: 100%; \n  height: 100%; \n  object-fit: contain; \n  display: block; \n}\n\n/* --- BUTTONS --- */\n.btn {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 10px;\n  font-size: 0.95rem;\n  font-weight: 700;\n  padding: 14px 28px;\n  border-radius: var(--radius-md);\n  cursor: pointer;\n  border: 1px solid transparent;\n  transition: all var(--transition-normal);\n  white-space: nowrap;\n  min-height: 48px;\n  position: relative;\n  overflow: hidden;\n}\n\n.btn-sm {\n  padding: 8px 18px;\n  font-size: 0.88rem;\n  min-height: 40px;\n}\n\n.btn-lg {\n  padding: 18px 36px;\n  font-size: 1.08rem;\n  border-radius: var(--radius-lg);\n}\n\n.btn-full {\n  width: 100%;\n}\n\n.btn-primary {\n  background: linear-gradient(135deg, var(--accent-purple) 0%, var(--accent-blue) 100%);\n  color: #ffffff;\n  box-shadow: 0 6px 24px rgba(139, 60, 255, 0.4);\n}\n\n.btn-primary:hover {\n  background: linear-gradient(135deg, #9b52ff 0%, #5d5bf6 100%);\n  box-shadow: 0 8px 32px rgba(139, 60, 255, 0.6);\n  transform: translateY(-2px);\n}\n\n.btn-secondary {\n  background: rgba(255, 255, 255, 0.04);\n  color: var(--text-primary);\n  border-color: var(--border-glass);\n  backdrop-filter: blur(12px);\n}\n\n.btn-secondary:hover {\n  background: rgba(255, 255, 255, 0.09);\n  border-color: var(--border-glow);\n  transform: translateY(-2px);\n  box-shadow: 0 0 20px rgba(139, 60, 255, 0.2);\n}\n\n.btn-outline {\n  background: transparent;\n  color: var(--text-primary);\n  border-color: var(--border-glow);\n}\n\n.btn-outline:hover {\n  background: rgba(139, 60, 255, 0.12);\n  border-color: var(--accent-purple-light);\n  color: var(--accent-purple-light);\n  box-shadow: 0 0 24px rgba(139, 60, 255, 0.25);\n}\n\n.btn-header {\n  background: rgba(139, 60, 255, 0.14);\n  color: var(--text-primary);\n  border: 1px solid rgba(139, 60, 255, 0.35);\n  padding: 9px 20px;\n  font-size: 0.9rem;\n  min-height: 42px;\n  border-radius: var(--radius-full);\n}\n\n.btn-header:hover {\n  background: var(--accent-purple);\n  border-color: var(--accent-purple);\n  box-shadow: 0 0 25px rgba(139, 60, 255, 0.5);\n  color: #ffffff;\n  transform: translateY(-1px);\n}\n\n/* Icon Utilities */\n.icon-sm { width: 18px; height: 18px; }\n.icon-md { width: 22px; height: 22px; }\n\n/* --- HEADER & NAVIGATION --- */\n.header {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  z-index: 1000;\n  background: rgba(3, 5, 9, 0.82);\n  backdrop-filter: blur(20px);\n  -webkit-backdrop-filter: blur(20px);\n  border-bottom: 1px solid var(--border-subtle);\n  transition: background var(--transition-normal), border-color var(--transition-normal), box-shadow var(--transition-normal);\n}\n\n.header-container {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  height: 84px;\n}\n\n.nav-desktop {\n  display: flex;\n  align-items: center;\n}\n\n.nav-list {\n  display: flex;\n  align-items: center;\n  gap: 22px;\n}\n\n.nav-link {\n  font-size: 0.92rem;\n  font-weight: 600;\n  color: var(--text-secondary);\n  position: relative;\n  padding: 8px 12px;\n  border-radius: var(--radius-sm);\n  transition: all var(--transition-fast);\n}\n\n.nav-link:hover, .nav-link.active, .nav-link.active-parent {\n  color: var(--text-primary);\n  background: rgba(255, 255, 255, 0.05);\n}\n\n.nav-link.active, .nav-link.active-parent {\n  color: var(--accent-purple-light);\n  background: rgba(139, 60, 255, 0.12);\n}\n\n/* --- DESKTOP DROPDOWN MENU --- */\n.nav-item-dropdown {\n  position: relative;\n}\n\n.nav-dropdown-trigger {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  cursor: pointer;\n}\n\n.dropdown-chevron {\n  width: 14px;\n  height: 14px;\n  transition: transform var(--transition-fast);\n  color: var(--text-muted);\n}\n\n.nav-item-dropdown:hover .dropdown-chevron,\n.nav-item-dropdown:focus-within .dropdown-chevron {\n  transform: rotate(180deg);\n  color: var(--accent-purple-light);\n}\n\n.dropdown-menu {\n  position: absolute;\n  top: 100%;\n  left: -12px;\n  min-width: 210px;\n  background: rgba(10, 15, 28, 0.96);\n  backdrop-filter: blur(20px);\n  -webkit-backdrop-filter: blur(20px);\n  border: 1px solid var(--border-glow);\n  border-radius: var(--radius-md);\n  padding: 8px;\n  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.6), 0 0 25px rgba(139, 60, 255, 0.2);\n  opacity: 0;\n  visibility: hidden;\n  transform: translateY(12px) scale(0.97);\n  transition: all var(--transition-fast);\n  pointer-events: none;\n  z-index: 1050;\n  display: flex;\n  flex-direction: column;\n  gap: 3px;\n}\n\n/* Hover bridge to prevent menu from closing when moving cursor */\n.nav-item-dropdown::after {\n  content: '';\n  position: absolute;\n  top: 100%;\n  left: 0;\n  width: 100%;\n  height: 12px;\n}\n\n.nav-item-dropdown:hover .dropdown-menu,\n.nav-item-dropdown:focus-within .dropdown-menu {\n  opacity: 1;\n  visibility: visible;\n  transform: translateY(6px) scale(1);\n  pointer-events: auto;\n}\n\n.dropdown-link {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  padding: 10px 14px;\n  font-size: 0.88rem;\n  font-weight: 600;\n  color: var(--text-secondary);\n  border-radius: var(--radius-sm);\n  transition: all var(--transition-fast);\n  text-decoration: none;\n  white-space: nowrap;\n}\n\n.dropdown-link:hover, .dropdown-link:focus, .dropdown-link.active {\n  color: var(--text-primary);\n  background: rgba(139, 60, 255, 0.16);\n  transform: translateX(3px);\n}\n\n.dropdown-icon {\n  font-size: 0.95rem;\n  width: 18px;\n  text-align: center;\n}\n\n.header-actions {\n  display: flex;\n  align-items: center;\n  gap: 16px;\n}\n\n.header-phone {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  font-size: 0.9rem;\n  font-weight: 600;\n  color: var(--text-secondary);\n  padding: 8px 14px;\n  border-radius: var(--radius-full);\n  border: 1px solid transparent;\n  transition: all var(--transition-fast);\n}\n\n.header-phone:hover {\n  color: var(--accent-cyan);\n  background: rgba(56, 189, 248, 0.08);\n  border-color: var(--border-cyan);\n}\n\n.menu-toggle {\n  display: none;\n  background: transparent;\n  border: 1px solid var(--border-subtle);\n  border-radius: var(--radius-sm);\n  padding: 8px;\n  flex-direction: column;\n  gap: 6px;\n  width: 44px;\n  height: 44px;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n}\n\n.hamburger-bar {\n  width: 22px;\n  height: 2px;\n  background-color: var(--text-primary);\n  border-radius: 2px;\n  transition: transform var(--transition-normal), opacity var(--transition-normal);\n}\n\n/* Mobile Dropdown Menu */\n.mobile-menu {\n  display: none;\n  position: fixed;\n  top: 84px;\n  left: 0;\n  width: 100%;\n  background: rgba(8, 12, 22, 0.98);\n  backdrop-filter: blur(24px);\n  border-bottom: 1px solid var(--border-glow);\n  padding: 28px 0;\n  z-index: 999;\n}\n\n.mobile-nav-list {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  margin-bottom: 24px;\n}\n\n.mobile-link {\n  font-size: 1.1rem;\n  font-weight: 600;\n  color: var(--text-secondary);\n  display: block;\n  padding: 10px 16px;\n  border-radius: var(--radius-md);\n  transition: all var(--transition-fast);\n}\n\n.mobile-link:hover, .mobile-link:focus {\n  color: var(--text-primary);\n  background: rgba(139, 60, 255, 0.15);\n}\n\n.mobile-dropdown-group {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.mobile-link-header {\n  font-weight: 800;\n  color: var(--text-primary);\n  background: rgba(255, 255, 255, 0.03);\n}\n\n.mobile-subnav {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n  padding-left: 16px;\n  margin-top: 2px;\n  margin-bottom: 6px;\n  border-left: 2px solid rgba(139, 60, 255, 0.35);\n}\n\n.mobile-sublink {\n  font-size: 0.98rem;\n  padding: 8px 12px;\n  color: var(--text-secondary);\n}\n\n.mobile-menu-actions {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n/* --- HERO SECTION --- */\n.hero-section {\n  padding-top: 170px;\n  padding-bottom: 110px;\n  position: relative;\n  overflow: hidden;\n}\n\n.hero-bg-grid {\n  position: absolute;\n  inset: 0;\n  background-image: \n    linear-gradient(to right, rgba(255, 255, 255, 0.04) 1px, transparent 1px),\n    linear-gradient(to bottom, rgba(255, 255, 255, 0.04) 1px, transparent 1px);\n  background-size: 48px 48px;\n  mask-image: radial-gradient(ellipse 70% 60% at 50% 0%, #000 70%, transparent 100%);\n  pointer-events: none;\n}\n\n.hero-glow-purple {\n  position: absolute;\n  top: -120px;\n  left: 35%;\n  width: 650px;\n  height: 650px;\n  background: radial-gradient(circle, rgba(139, 60, 255, 0.28) 0%, transparent 70%);\n  pointer-events: none;\n  filter: blur(90px);\n}\n\n.hero-glow-blue {\n  position: absolute;\n  top: 120px;\n  right: 5%;\n  width: 500px;\n  height: 500px;\n  background: radial-gradient(circle, rgba(56, 189, 248, 0.18) 0%, transparent 70%);\n  pointer-events: none;\n  filter: blur(80px);\n}\n\n.hero-container {\n  display: grid;\n  grid-template-columns: 1.15fr 0.85fr;\n  gap: 52px;\n  align-items: center;\n  position: relative;\n  z-index: 10;\n}\n\n.hero-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: 10px;\n  padding: 6px 18px;\n  border-radius: var(--radius-full);\n  background: rgba(139, 60, 255, 0.12);\n  border: 1px solid rgba(139, 60, 255, 0.35);\n  margin-bottom: 24px;\n  box-shadow: 0 0 20px rgba(139, 60, 255, 0.15);\n}\n\n.badge-dot {\n  width: 8px;\n  height: 8px;\n  background-color: var(--accent-cyan);\n  border-radius: 50%;\n  box-shadow: 0 0 12px var(--accent-cyan);\n  animation: pulse-dot 2s infinite;\n}\n\n.badge-text {\n  font-family: var(--font-mono);\n  font-size: 0.76rem;\n  font-weight: 700;\n  letter-spacing: 0.08em;\n  color: var(--text-primary);\n}\n\n.hero-title {\n  font-size: clamp(2.5rem, 4.5vw, 3.6rem);\n  font-weight: 800;\n  line-height: 1.12;\n  margin-bottom: 24px;\n  letter-spacing: -0.03em;\n}\n\n.hero-subheadline {\n  font-size: 1.18rem;\n  line-height: 1.65;\n  color: var(--text-secondary);\n  margin-bottom: 38px;\n  max-width: 620px;\n}\n\n.hero-ctas {\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  flex-wrap: wrap;\n  margin-bottom: 36px;\n}\n\n.hero-microcopy {\n  display: flex;\n  align-items: center;\n  gap: 20px;\n  flex-wrap: wrap;\n  font-size: 0.88rem;\n  color: var(--text-muted);\n}\n\n.microcopy-item {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n}\n\n/* Hero Visual Panel */\n.visual-panel {\n  background: rgba(15, 21, 38, 0.85);\n  backdrop-filter: blur(20px);\n  border: 1px solid var(--border-glow);\n  border-radius: var(--radius-xl);\n  box-shadow: var(--shadow-card), var(--shadow-glow);\n  overflow: hidden;\n  position: relative;\n}\n\n.panel-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 16px 22px;\n  background: rgba(255, 255, 255, 0.025);\n  border-bottom: 1px solid var(--border-subtle);\n}\n\n.window-dots {\n  display: flex;\n  gap: 8px;\n}\n\n.dot {\n  width: 11px;\n  height: 11px;\n  border-radius: 50%;\n}\n\n.dot-red { background-color: #ff5f56; }\n.dot-yellow { background-color: #ffbd2e; }\n.dot-green { background-color: #27c93f; }\n\n.panel-title {\n  font-family: var(--font-mono);\n  font-size: 0.72rem;\n  color: var(--text-muted);\n  letter-spacing: 0.05em;\n  font-weight: 600;\n}\n\n.panel-badge {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  font-size: 0.72rem;\n  font-weight: 700;\n  color: var(--accent-green);\n  font-family: var(--font-mono);\n  background: rgba(16, 185, 129, 0.1);\n  padding: 3px 10px;\n  border-radius: var(--radius-full);\n  border: 1px solid rgba(16, 185, 129, 0.25);\n}\n\n.status-pulse {\n  width: 6px;\n  height: 6px;\n  background-color: var(--accent-green);\n  border-radius: 50%;\n  box-shadow: 0 0 10px var(--accent-green);\n  animation: pulse-dot 1.8s infinite;\n}\n\n.panel-body {\n  padding: 24px;\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n}\n\n.panel-nodes-grid {\n  display: grid;\n  grid-template-columns: repeat(2, 1fr);\n  gap: 14px;\n}\n\n.tech-node {\n  background: rgba(255, 255, 255, 0.02);\n  border: 1px solid var(--border-subtle);\n  border-radius: var(--radius-md);\n  padding: 14px 16px;\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  transition: all var(--transition-fast);\n}\n\n.tech-node:hover {\n  background: rgba(255, 255, 255, 0.05);\n  border-color: var(--border-glow);\n  transform: translateY(-2px);\n  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);\n}\n\n.node-icon {\n  font-size: 1.4rem;\n}\n\n.node-info {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n}\n\n.node-label {\n  font-size: 0.75rem;\n  color: var(--text-muted);\n}\n\n.node-value {\n  font-size: 0.88rem;\n  font-weight: 700;\n  color: var(--text-primary);\n}\n\n.node-status {\n  font-size: 0.7rem;\n  font-family: var(--font-mono);\n  font-weight: 700;\n}\n\n.panel-network-graph {\n  background: rgba(3, 5, 9, 0.6);\n  border: 1px solid var(--border-subtle);\n  border-radius: var(--radius-md);\n  padding: 12px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n\n.graph-svg {\n  width: 100%;\n  height: auto;\n  max-height: 120px;\n}\n\n.panel-console {\n  background: rgba(3, 5, 9, 0.92);\n  border: 1px solid var(--border-subtle);\n  border-radius: var(--radius-sm);\n  padding: 12px 16px;\n  font-family: var(--font-mono);\n  font-size: 0.82rem;\n  color: var(--accent-cyan);\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.console-prompt { color: var(--accent-purple-light); font-weight: bold; }\n.console-cursor { animation: blink 1s infinite; color: var(--accent-cyan); }\n\n/* --- INSTITUTIONAL SECTION --- */\n.pilar-grid {\n  margin-bottom: 52px;\n}\n\n.card {\n  background: var(--bg-card);\n  border: 1px solid var(--border-subtle);\n  border-radius: var(--radius-xl);\n  padding: 32px;\n  transition: all var(--transition-normal);\n  position: relative;\n  overflow: hidden;\n}\n\n.card::before {\n  content: '';\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: 2px;\n  background: linear-gradient(90deg, transparent, var(--accent-purple), transparent);\n  opacity: 0;\n  transition: opacity var(--transition-normal);\n}\n\n.card:hover {\n  transform: translateY(-5px);\n  border-color: var(--border-glow);\n  box-shadow: var(--shadow-card), var(--shadow-glow);\n  background: var(--bg-card-hover);\n}\n\n.card:hover::before {\n  opacity: 1;\n}\n\n.card-icon {\n  width: 54px;\n  height: 54px;\n  border-radius: var(--radius-md);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 1.6rem;\n  margin-bottom: 22px;\n}\n\n.icon-purple { background: rgba(139, 60, 255, 0.15); border: 1px solid rgba(139, 60, 255, 0.35); }\n.icon-blue { background: rgba(79, 70, 229, 0.15); border: 1px solid rgba(79, 70, 229, 0.35); }\n.icon-cyan { background: rgba(56, 189, 248, 0.15); border: 1px solid rgba(56, 189, 248, 0.35); }\n.icon-gold { background: rgba(245, 158, 11, 0.15); border: 1px solid rgba(245, 158, 11, 0.35); }\n\n.card-title {\n  font-size: 1.3rem;\n  margin-bottom: 12px;\n}\n\n.card-text {\n  font-size: 0.96rem;\n  line-height: 1.65;\n}\n\n.manifesto-box {\n  background: linear-gradient(135deg, rgba(15, 21, 38, 0.95) 0%, rgba(8, 12, 22, 0.98) 100%);\n  border: 1px solid var(--border-glow);\n  border-radius: var(--radius-xl);\n  padding: 44px;\n  margin-bottom: 52px;\n  box-shadow: var(--shadow-card), var(--shadow-glow);\n  position: relative;\n  overflow: hidden;\n}\n\n.manifesto-header {\n  margin-bottom: 22px;\n}\n\n.manifesto-badge {\n  font-family: var(--font-mono);\n  font-size: 0.75rem;\n  font-weight: 800;\n  letter-spacing: 0.12em;\n  color: var(--accent-gold);\n  background: rgba(245, 158, 11, 0.12);\n  padding: 4px 12px;\n  border-radius: var(--radius-full);\n  border: 1px solid rgba(245, 158, 11, 0.25);\n}\n\n.manifesto-title {\n  font-size: 1.85rem;\n  margin-top: 12px;\n}\n\n.manifesto-body {\n  font-size: 1.1rem;\n  line-height: 1.75;\n  color: var(--text-secondary);\n  display: flex;\n  flex-direction: column;\n  gap: 18px;\n}\n\n.manifesto-body strong {\n  color: var(--text-primary);\n}\n\n/* MVV Cards */\n.mvv-grid {\n  margin-bottom: 52px;\n}\n\n.mvv-card {\n  background: rgba(255, 255, 255, 0.02);\n  border: 1px solid var(--border-subtle);\n  border-radius: var(--radius-lg);\n  padding: 28px;\n  transition: all var(--transition-fast);\n}\n\n.mvv-card:hover {\n  border-color: var(--border-glow);\n  background: rgba(255, 255, 255, 0.04);\n}\n\n.mvv-label {\n  font-family: var(--font-mono);\n  font-size: 0.75rem;\n  font-weight: 800;\n  letter-spacing: 0.1em;\n  color: var(--accent-purple-light);\n  display: inline-block;\n  margin-bottom: 10px;\n}\n\n.mvv-title {\n  font-size: 1.2rem;\n  margin-bottom: 12px;\n}\n\n.mvv-text {\n  font-size: 0.94rem;\n  line-height: 1.6;\n}\n\n/* Slogans Banner */\n.slogans-banner {\n  background: rgba(139, 60, 255, 0.08);\n  border: 1px solid rgba(139, 60, 255, 0.25);\n  border-radius: var(--radius-lg);\n  padding: 24px 32px;\n  text-align: center;\n  box-shadow: 0 0 30px rgba(139, 60, 255, 0.08);\n}\n\n.slogan-tag {\n  font-family: var(--font-mono);\n  font-size: 0.75rem;\n  font-weight: 800;\n  letter-spacing: 0.1em;\n  color: var(--accent-cyan);\n  margin-bottom: 10px;\n}\n\n.slogan-list {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 18px;\n  flex-wrap: wrap;\n  font-size: 1.05rem;\n  font-weight: 700;\n  color: var(--text-primary);\n}\n\n.slogan-divider {\n  color: var(--accent-purple-light);\n}\n\n/* --- SERVICES SECTION (9 CARDS) --- */\n.servicos-grid {\n  align-items: stretch;\n}\n\n.service-flip-card {\n  perspective: 1200px;\n  min-height: 490px;\n  height: 100%;\n}\n\n.service-card-inner {\n  position: relative;\n  width: 100%;\n  height: 100%;\n  min-height: 490px;\n  transition: transform 0.65s cubic-bezier(0.2, 0.8, 0.2, 1);\n  transform-style: preserve-3d;\n}\n\n.service-flip-card.is-flipped .service-card-inner {\n  transform: rotateY(180deg);\n}\n\n.service-card-front,\n.service-card-back {\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  backface-visibility: hidden;\n  -webkit-backface-visibility: hidden;\n  border-radius: var(--radius-xl);\n  padding: 28px;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  background: var(--bg-card);\n  border: 1px solid var(--border-subtle);\n  box-shadow: var(--shadow-card);\n  transition: border-color var(--transition-normal), box-shadow var(--transition-normal), background var(--transition-normal);\n  overflow: hidden;\n}\n\n.service-flip-card:hover .service-card-front,\n.service-flip-card:hover .service-card-back {\n  border-color: var(--border-glow);\n  box-shadow: var(--shadow-card), var(--shadow-glow);\n}\n\n.service-card-back {\n  transform: rotateY(180deg);\n  background: linear-gradient(145deg, #0d1222 0%, #161c30 100%);\n  border-color: var(--border-glow);\n}\n\n.service-card-top {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n}\n\n.service-card-bottom {\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n  margin-top: 14px;\n}\n\n.service-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 16px;\n}\n\n.service-code {\n  font-family: var(--font-mono);\n  font-size: 0.8rem;\n  font-weight: 800;\n  color: var(--accent-purple-light);\n  background: rgba(139, 60, 255, 0.15);\n  padding: 3px 12px;\n  border-radius: var(--radius-sm);\n  border: 1px solid rgba(139, 60, 255, 0.35);\n}\n\n.service-category {\n  font-family: var(--font-mono);\n  font-size: 0.72rem;\n  font-weight: 700;\n  letter-spacing: 0.08em;\n  color: var(--text-muted);\n}\n\n.service-category-back {\n  font-family: var(--font-mono);\n  font-size: 0.72rem;\n  font-weight: 700;\n  letter-spacing: 0.08em;\n  color: var(--accent-purple-light);\n}\n\n.service-title {\n  font-size: 1.3rem;\n  margin-bottom: 12px;\n  line-height: 1.35;\n}\n\n.service-title-back {\n  font-size: 1.1rem;\n  font-weight: 700;\n  color: var(--text-primary);\n  margin-bottom: 12px;\n}\n\n.service-description {\n  font-size: 0.92rem;\n  color: var(--text-secondary);\n  margin-bottom: 16px;\n  line-height: 1.55;\n}\n\n.service-benefits {\n  margin-bottom: 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.service-benefits li {\n  font-size: 0.86rem;\n  color: var(--text-primary);\n  display: flex;\n  align-items: flex-start;\n  gap: 8px;\n  line-height: 1.4;\n}\n\n.service-gain {\n  background: rgba(3, 5, 9, 0.7);\n  border-left: 3px solid var(--accent-cyan);\n  padding: 12px 14px;\n  border-radius: 0 var(--radius-md) var(--radius-md) 0;\n  font-size: 0.85rem;\n  color: var(--text-secondary);\n  margin-top: auto;\n  border-top: 1px solid rgba(255, 255, 255, 0.03);\n  border-bottom: 1px solid rgba(255, 255, 255, 0.03);\n  border-right: 1px solid rgba(255, 255, 255, 0.03);\n}\n\n.service-gain strong {\n  color: var(--accent-cyan);\n  display: block;\n  margin-bottom: 2px;\n}\n\n.service-gain-back {\n  border-left-color: var(--accent-purple-light);\n}\n\n.service-gain-back strong {\n  color: var(--accent-purple-light);\n}\n\n.btn-flip-trigger {\n  background: rgba(139, 60, 255, 0.12);\n  color: var(--accent-purple-light);\n  border: 1px solid rgba(139, 60, 255, 0.35);\n  font-size: 0.85rem;\n  font-weight: 700;\n  padding: 10px 16px;\n  border-radius: var(--radius-md);\n  cursor: pointer;\n  transition: all var(--transition-fast);\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n  width: 100%;\n}\n\n.btn-flip-trigger:hover {\n  background: var(--accent-purple);\n  color: #ffffff;\n  border-color: var(--accent-purple);\n  box-shadow: 0 0 20px rgba(139, 60, 255, 0.4);\n}\n\n.btn-flip-back {\n  background: rgba(255, 255, 255, 0.05);\n  color: var(--text-secondary);\n  border: 1px solid var(--border-subtle);\n  font-size: 0.85rem;\n  font-weight: 700;\n  padding: 10px 16px;\n  border-radius: var(--radius-md);\n  cursor: pointer;\n  transition: all var(--transition-fast);\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 8px;\n  width: 100%;\n}\n\n.btn-flip-back:hover {\n  background: rgba(255, 255, 255, 0.12);\n  color: var(--text-primary);\n  border-color: var(--border-glass);\n}\n\n.service-cta {\n  margin-top: auto;\n}\n\n/* --- IMPACTS SECTION (8 CARDS) --- */\n.impacto-card {\n  position: relative;\n  overflow: hidden;\n  background: var(--bg-card);\n  border: 1px solid var(--border-subtle);\n  border-radius: var(--radius-xl);\n  padding: 30px;\n  transition: all var(--transition-normal);\n}\n\n.impacto-card:hover {\n  transform: translateY(-4px);\n  border-color: var(--border-glow);\n  box-shadow: var(--shadow-card), 0 0 30px rgba(139, 60, 255, 0.15);\n}\n\n.impacto-num {\n  font-family: var(--font-mono);\n  font-size: 2.75rem;\n  font-weight: 800;\n  color: rgba(139, 60, 255, 0.35);\n  line-height: 1;\n  margin-bottom: 14px;\n}\n\n.impacto-title {\n  font-size: 1.2rem;\n  margin-bottom: 10px;\n}\n\n.impacto-text {\n  font-size: 0.92rem;\n  line-height: 1.6;\n}\n\n/* --- TECHNOLOGY TABS SECTION --- */\n.tech-tabs-wrapper {\n  background: var(--bg-card);\n  border: 1px solid var(--border-subtle);\n  border-radius: var(--radius-xl);\n  padding: 36px;\n  box-shadow: var(--shadow-card);\n}\n\n.tech-tabs {\n  display: flex;\n  gap: 12px;\n  border-bottom: 1px solid var(--border-subtle);\n  padding-bottom: 18px;\n  margin-bottom: 36px;\n  overflow-x: auto;\n}\n\n.tech-tab {\n  background: transparent;\n  border: 1px solid transparent;\n  color: var(--text-secondary);\n  font-size: 0.95rem;\n  font-weight: 700;\n  padding: 12px 24px;\n  border-radius: var(--radius-md);\n  cursor: pointer;\n  transition: all var(--transition-fast);\n  white-space: nowrap;\n}\n\n.tech-tab:hover {\n  color: var(--text-primary);\n  background: rgba(255, 255, 255, 0.05);\n}\n\n.tech-tab.active {\n  color: #ffffff;\n  background: linear-gradient(135deg, rgba(139, 60, 255, 0.25) 0%, rgba(79, 70, 229, 0.25) 100%);\n  border-color: var(--border-glow);\n  box-shadow: 0 0 20px rgba(139, 60, 255, 0.2);\n}\n\n.tech-tab-panel {\n  display: block;\n}\n\n.tech-tab-panel[hidden] {\n  display: none;\n}\n\n.tech-panel-title {\n  font-size: 1.6rem;\n  margin-bottom: 18px;\n}\n\n.tech-panel-info p {\n  font-size: 1.02rem;\n  margin-bottom: 24px;\n  line-height: 1.65;\n}\n\n.tech-checklist {\n  display: flex;\n  flex-direction: column;\n  gap: 14px;\n}\n\n.tech-checklist li {\n  font-size: 0.94rem;\n  color: var(--text-secondary);\n}\n\n.tech-checklist strong {\n  color: var(--text-primary);\n}\n\n.code-window {\n  background: #030509;\n  border: 1px solid var(--border-subtle);\n  border-radius: var(--radius-lg);\n  padding: 24px;\n  font-family: var(--font-mono);\n  font-size: 0.88rem;\n  color: #e2e8f0;\n  overflow-x: auto;\n  box-shadow: inset 0 2px 10px rgba(0, 0, 0, 0.6);\n}\n\n.code-title {\n  color: var(--text-muted);\n  font-size: 0.78rem;\n  margin-bottom: 16px;\n  border-bottom: 1px solid rgba(255, 255, 255, 0.06);\n  padding-bottom: 10px;\n}\n\n.code-keyword { color: #f472b6; font-weight: 600; }\n.code-str { color: #38bdf8; }\n.code-prop { color: #a865ff; }\n.code-num { color: #f59e0b; }\n\n/* --- VALIDATION SECTION --- */\n.validacao-box {\n  align-items: center;\n  gap: 48px;\n}\n\n.validacao-heading {\n  font-size: 1.9rem;\n  margin-bottom: 22px;\n}\n\n.validacao-content p {\n  font-size: 1.06rem;\n  line-height: 1.7;\n  margin-bottom: 22px;\n}\n\n.validacao-pillars {\n  display: flex;\n  flex-direction: column;\n  gap: 18px;\n  margin-top: 28px;\n}\n\n.pillar-item {\n  display: flex;\n  gap: 18px;\n  align-items: flex-start;\n  background: rgba(255, 255, 255, 0.02);\n  border: 1px solid var(--border-subtle);\n  padding: 18px 20px;\n  border-radius: var(--radius-lg);\n  transition: all var(--transition-fast);\n}\n\n.pillar-item:hover {\n  border-color: var(--border-glow);\n  background: rgba(255, 255, 255, 0.04);\n}\n\n.pillar-num {\n  font-family: var(--font-mono);\n  font-size: 1rem;\n  font-weight: 800;\n  color: var(--accent-cyan);\n  background: rgba(56, 189, 248, 0.12);\n  padding: 5px 10px;\n  border-radius: var(--radius-sm);\n  border: 1px solid rgba(56, 189, 248, 0.25);\n}\n\n.pillar-item strong {\n  display: block;\n  color: var(--text-primary);\n  margin-bottom: 4px;\n}\n\n.pillar-item span {\n  font-size: 0.9rem;\n  color: var(--text-secondary);\n  line-height: 1.5;\n}\n\n.card-glow {\n  border-color: var(--border-glow);\n  box-shadow: var(--shadow-glow);\n}\n\n.card-checklist-mini {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n  margin-top: 24px;\n  font-size: 0.92rem;\n  color: var(--text-secondary);\n}\n\n.mt-4 { margin-top: 28px; }\n\n/* --- METHOD TIMELINE (7 STEPS) --- */\n.metodo-timeline {\n  display: flex;\n  flex-direction: column;\n  gap: 22px;\n  position: relative;\n  max-width: 880px;\n  margin: 0 auto;\n}\n\n.metodo-step {\n  display: flex;\n  align-items: flex-start;\n  gap: 26px;\n  background: var(--bg-card);\n  border: 1px solid var(--border-subtle);\n  border-radius: var(--radius-xl);\n  padding: 28px;\n  transition: all var(--transition-fast);\n}\n\n.metodo-step:hover {\n  transform: translateX(8px);\n  border-color: var(--border-glow);\n  box-shadow: var(--shadow-card), 0 0 25px rgba(139, 60, 255, 0.12);\n}\n\n.step-num {\n  font-family: var(--font-mono);\n  font-size: 1.5rem;\n  font-weight: 800;\n  color: var(--accent-purple-light);\n  background: rgba(139, 60, 255, 0.15);\n  border: 1px solid rgba(139, 60, 255, 0.35);\n  width: 58px;\n  height: 58px;\n  border-radius: var(--radius-lg);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n}\n\n.step-title {\n  font-size: 1.3rem;\n  margin-bottom: 8px;\n}\n\n.step-desc {\n  font-size: 0.98rem;\n  line-height: 1.6;\n}\n\n/* --- FAQ SECTION (DETAILS/SUMMARY) --- */\n.faq-list {\n  display: flex;\n  flex-direction: column;\n  gap: 18px;\n}\n\n.faq-item {\n  background: var(--bg-card);\n  border: 1px solid var(--border-subtle);\n  border-radius: var(--radius-lg);\n  overflow: hidden;\n  transition: all var(--transition-fast);\n}\n\n.faq-item[open] {\n  border-color: var(--border-glow);\n  background: var(--bg-card-hover);\n  box-shadow: var(--shadow-glow);\n}\n\n.faq-question {\n  padding: 22px 28px;\n  font-size: 1.12rem;\n  font-weight: 700;\n  color: var(--text-primary);\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  list-style: none;\n}\n\n.faq-question::-webkit-details-marker {\n  display: none;\n}\n\n.faq-icon {\n  font-size: 1.5rem;\n  color: var(--accent-purple-light);\n  transition: transform var(--transition-fast);\n  width: 28px;\n  text-align: center;\n}\n\n.faq-item[open] .faq-icon {\n  transform: rotate(45deg);\n}\n\n.faq-answer {\n  padding: 0 28px 26px 28px;\n  font-size: 1rem;\n  line-height: 1.65;\n  color: var(--text-secondary);\n  border-top: 1px solid rgba(255, 255, 255, 0.04);\n  margin-top: 4px;\n  padding-top: 18px;\n}\n\n/* --- CONTACT & FORM SECTION --- */\n.contato-grid {\n  align-items: flex-start;\n  gap: 52px;\n}\n\n.contato-details {\n  display: flex;\n  flex-direction: column;\n  gap: 22px;\n  margin-top: 36px;\n  margin-bottom: 36px;\n}\n\n.detail-item {\n  display: flex;\n  align-items: center;\n  gap: 18px;\n  font-size: 0.98rem;\n}\n\n.detail-icon {\n  width: 48px;\n  height: 48px;\n  background: rgba(255, 255, 255, 0.03);\n  border: 1px solid var(--border-subtle);\n  border-radius: var(--radius-md);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 1.3rem;\n  flex-shrink: 0;\n}\n\n.detail-item strong {\n  display: block;\n  color: var(--text-primary);\n}\n\n.detail-link {\n  color: var(--accent-cyan);\n  font-weight: 600;\n}\n\n.detail-link:hover {\n  text-decoration: underline;\n}\n\n.contato-reassurance {\n  background: rgba(16, 185, 129, 0.08);\n  border: 1px solid rgba(16, 185, 129, 0.22);\n  border-radius: var(--radius-lg);\n  padding: 18px 22px;\n}\n\n.reassurance-title {\n  font-size: 0.92rem;\n  font-weight: 700;\n  color: var(--accent-green);\n  margin-bottom: 4px;\n}\n\n.contato-reassurance p {\n  font-size: 0.88rem;\n  line-height: 1.5;\n}\n\n/* Form Card */\n.form-card {\n  background: var(--bg-card);\n  border: 1px solid var(--border-glow);\n  border-radius: var(--radius-xl);\n  padding: 40px;\n  box-shadow: var(--shadow-card), var(--shadow-glow);\n  display: flex;\n  flex-direction: column;\n  gap: 22px;\n}\n\n.form-title {\n  font-size: 1.6rem;\n}\n\n.form-subtext {\n  font-size: 0.92rem;\n  margin-top: -14px;\n}\n\n.form-group {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.form-grid {\n  display: grid;\n  grid-template-columns: repeat(2, 1fr);\n  gap: 18px;\n}\n\n.form-label {\n  font-size: 0.9rem;\n  font-weight: 700;\n  color: var(--text-primary);\n}\n\n.required {\n  color: #ef4444;\n}\n\n.form-input, .form-select, .form-textarea {\n  width: 100%;\n  background: rgba(3, 5, 9, 0.85);\n  border: 1px solid var(--border-subtle);\n  border-radius: var(--radius-md);\n  padding: 14px 18px;\n  font-family: var(--font-sans);\n  font-size: 0.98rem;\n  color: var(--text-primary);\n  transition: all var(--transition-fast);\n}\n\n.form-input:focus, .form-select:focus, .form-textarea:focus {\n  border-color: var(--accent-purple-light);\n  box-shadow: 0 0 16px rgba(139, 60, 255, 0.3);\n  background: rgba(3, 5, 9, 0.95);\n}\n\n.form-select option {\n  background-color: var(--bg-surface);\n  color: var(--text-primary);\n}\n\n.form-textarea {\n  resize: vertical;\n  min-height: 100px;\n}\n\n.form-feedback {\n  background: rgba(16, 185, 129, 0.15);\n  border: 1px solid rgba(16, 185, 129, 0.35);\n  color: #10b981;\n  padding: 16px;\n  border-radius: var(--radius-md);\n  font-size: 0.94rem;\n  text-align: center;\n  font-weight: 600;\n}\n\n.hidden { display: none !important; }\n\n/* --- FOOTER --- */\n.footer {\n  background: #020306;\n  border-top: 1px solid var(--border-subtle);\n  padding-top: 90px;\n  padding-bottom: 44px;\n  position: relative;\n}\n\n.footer-top {\n  display: grid;\n  grid-template-columns: 2fr 1fr 1fr 1.5fr;\n  gap: 44px;\n  margin-bottom: 64px;\n}\n\n.footer-about {\n  font-size: 0.92rem;\n  margin-top: 22px;\n  max-width: 380px;\n  line-height: 1.65;\n}\n\n.footer-heading {\n  font-size: 1.05rem;\n  margin-bottom: 22px;\n  color: var(--text-primary);\n  font-weight: 700;\n}\n\n.footer-links, .footer-contact-list {\n  display: flex;\n  flex-direction: column;\n  gap: 14px;\n  font-size: 0.92rem;\n}\n\n.footer-links a {\n  color: var(--text-secondary);\n}\n\n.footer-links a:hover {\n  color: var(--accent-cyan);\n}\n\n.footer-contact-list strong {\n  color: var(--text-primary);\n}\n\n.footer-contact-list a {\n  color: var(--accent-cyan);\n  font-weight: 600;\n}\n\n.footer-bottom {\n  border-top: 1px solid rgba(255, 255, 255, 0.05);\n  padding-top: 32px;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  font-size: 0.88rem;\n  color: var(--text-muted);\n  flex-wrap: wrap;\n  gap: 18px;\n}\n\n/* --- FLOATING WHATSAPP BUTTON --- */\n.whatsapp-float {\n  position: fixed;\n  bottom: 28px;\n  right: 28px;\n  width: 62px;\n  height: 62px;\n  background-color: #25d366;\n  color: #ffffff;\n  border-radius: 50%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  box-shadow: 0 10px 30px rgba(37, 211, 102, 0.45);\n  z-index: 999;\n  transition: transform var(--transition-fast), box-shadow var(--transition-fast);\n}\n\n.whatsapp-float:hover {\n  transform: scale(1.08);\n  box-shadow: 0 14px 38px rgba(37, 211, 102, 0.65);\n}\n\n.whatsapp-icon {\n  width: 34px;\n  height: 34px;\n}\n\n.whatsapp-pulse {\n  position: absolute;\n  inset: 0;\n  border-radius: 50%;\n  border: 2px solid #25d366;\n  animation: pulse-ring 2s infinite;\n  pointer-events: none;\n}\n\n.whatsapp-tooltip {\n  position: absolute;\n  right: 74px;\n  background: var(--bg-card);\n  color: var(--text-primary);\n  font-size: 0.85rem;\n  font-weight: 700;\n  padding: 8px 16px;\n  border-radius: var(--radius-md);\n  border: 1px solid var(--border-glow);\n  white-space: nowrap;\n  box-shadow: var(--shadow-card);\n  opacity: 0;\n  pointer-events: none;\n  transition: opacity var(--transition-fast);\n}\n\n.whatsapp-float:hover .whatsapp-tooltip {\n  opacity: 1;\n}\n\n/* --- EXPORTADOR HOSTOO (FLOATING TRIGGER & MODAL) --- */\n.modal-overlay {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  width: 100vw;\n  height: 100vh;\n  background: rgba(3, 6, 14, 0.85);\n  backdrop-filter: blur(14px);\n  -webkit-backdrop-filter: blur(14px);\n  z-index: 10000;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  opacity: 0;\n  visibility: hidden;\n  pointer-events: none;\n  transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.3s cubic-bezier(0.16, 1, 0.3, 1);\n  padding: 20px;\n}\n\n.modal-overlay.active {\n  opacity: 1;\n  visibility: visible;\n  pointer-events: auto;\n}\n\n.modal-container {\n  transform: translateY(20px) scale(0.95);\n  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);\n}\n\n.modal-overlay.active .modal-container {\n  transform: translateY(0) scale(1);\n}\n\n.hostoo-exporter-trigger {\n  position: fixed;\n  bottom: 24px;\n  left: 24px;\n  z-index: 999;\n}\n\n.btn-hostoo-trigger {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  background: rgba(13, 19, 30, 0.94);\n  backdrop-filter: blur(14px);\n  -webkit-backdrop-filter: blur(14px);\n  border: 1px solid rgba(34, 197, 94, 0.4);\n  border-radius: var(--radius-lg);\n  padding: 10px 16px;\n  color: var(--text-primary);\n  cursor: pointer;\n  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.5), 0 0 18px rgba(34, 197, 94, 0.2);\n  transition: all var(--transition-normal);\n}\n\n.btn-hostoo-trigger:hover {\n  transform: translateY(-3px);\n  border-color: #22c55e;\n  box-shadow: 0 12px 38px rgba(0, 0, 0, 0.6), 0 0 28px rgba(34, 197, 94, 0.35);\n  background: rgba(18, 26, 42, 0.98);\n}\n\n.hostoo-badge-icon {\n  font-size: 1.35rem;\n}\n\n.hostoo-trigger-text {\n  display: flex;\n  flex-direction: column;\n  text-align: left;\n}\n\n.hostoo-trigger-title {\n  font-family: var(--font-mono);\n  font-size: 0.8rem;\n  font-weight: 800;\n  letter-spacing: 0.05em;\n  color: #ffffff;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n}\n\n.v2-pill {\n  background: rgba(34, 197, 94, 0.15);\n  color: #4ade80;\n  border: 1px solid rgba(34, 197, 94, 0.35);\n  font-size: 0.62rem;\n  font-weight: 700;\n  padding: 1px 6px;\n  border-radius: 4px;\n}\n\n.hostoo-trigger-sub {\n  font-size: 0.72rem;\n  color: var(--text-muted);\n}\n\n.hostoo-status-pill {\n  background: rgba(34, 197, 94, 0.15);\n  color: #4ade80;\n  border: 1px solid rgba(34, 197, 94, 0.35);\n  font-family: var(--font-mono);\n  font-size: 0.65rem;\n  font-weight: 700;\n  padding: 3px 8px;\n  border-radius: 20px;\n  text-transform: uppercase;\n}\n\n/* Modal Hostoo Specifics - Match exportador hostoo.jpg */\n.hostoo-modal-card {\n  max-width: 540px;\n  width: 94%;\n  max-height: 90vh;\n  overflow-y: auto;\n  background: #0b111a;\n  border: 1px solid rgba(34, 197, 94, 0.25);\n  border-radius: 20px;\n  padding: 26px;\n  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.8), 0 0 35px rgba(34, 197, 94, 0.15);\n  color: #ffffff;\n}\n\n.hostoo-card-header {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  margin-bottom: 20px;\n}\n\n.hostoo-header-left {\n  display: flex;\n  align-items: center;\n  gap: 14px;\n}\n\n.hostoo-shield-badge {\n  width: 48px;\n  height: 48px;\n  border-radius: 12px;\n  background: rgba(34, 197, 94, 0.12);\n  border: 1px solid rgba(34, 197, 94, 0.3);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  color: #4ade80;\n  flex-shrink: 0;\n}\n\n.shield-icon {\n  width: 24px;\n  height: 24px;\n}\n\n.hostoo-title-group {\n  display: flex;\n  flex-direction: column;\n}\n\n.hostoo-title-row {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n\n.hostoo-card-title {\n  font-size: 1.35rem;\n  font-weight: 800;\n  color: #ffffff;\n  margin: 0;\n  letter-spacing: -0.02em;\n}\n\n.v2-badge {\n  background: rgba(34, 197, 94, 0.15);\n  color: #4ade80;\n  border: 1px solid rgba(34, 197, 94, 0.35);\n  font-family: var(--font-mono);\n  font-size: 0.68rem;\n  font-weight: 700;\n  padding: 2px 8px;\n  border-radius: 6px;\n}\n\n.hostoo-card-subtitle {\n  font-size: 0.85rem;\n  color: #94a3b8;\n  margin: 3px 0 0 0;\n}\n\n.hostoo-card-close {\n  background: rgba(255, 255, 255, 0.05);\n  border: 1px solid rgba(255, 255, 255, 0.1);\n  border-radius: 8px;\n  color: #94a3b8;\n  width: 34px;\n  height: 34px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 1.25rem;\n  cursor: pointer;\n  transition: all var(--transition-fast);\n}\n\n.hostoo-card-close:hover {\n  background: rgba(255, 255, 255, 0.15);\n  color: #ffffff;\n}\n\n.hostoo-description-text {\n  font-size: 0.95rem;\n  color: #cbd5e1;\n  line-height: 1.65;\n  margin-bottom: 22px;\n}\n\n.hostoo-description-text strong {\n  color: #ffffff;\n}\n\n.hostoo-description-text code {\n  background: rgba(34, 197, 94, 0.12);\n  color: #4ade80;\n  padding: 2px 6px;\n  border-radius: 4px;\n  font-family: var(--font-mono);\n  font-size: 0.82rem;\n}\n\n/* Big Green Download Button */\n.btn-hostoo-download-primary {\n  width: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 10px;\n  background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);\n  border: 1px solid #4ade80;\n  border-radius: 14px;\n  padding: 16px 22px;\n  color: #021a0d;\n  font-size: 1.05rem;\n  font-weight: 800;\n  cursor: pointer;\n  box-shadow: 0 8px 24px rgba(34, 197, 94, 0.35);\n  transition: all var(--transition-normal);\n}\n\n.btn-hostoo-download-primary:hover {\n  transform: translateY(-2px);\n  box-shadow: 0 12px 32px rgba(34, 197, 94, 0.55);\n  background: linear-gradient(135deg, #4ade80 0%, #22c55e 100%);\n}\n\n.download-icon {\n  width: 22px;\n  height: 22px;\n}\n\n.hostoo-card-footer {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-top: 22px;\n  padding-top: 16px;\n  border-top: 1px solid rgba(255, 255, 255, 0.08);\n}\n\n.btn-hostoo-guide-toggle {\n  background: transparent;\n  border: none;\n  color: #4ade80;\n  font-size: 0.85rem;\n  font-weight: 600;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  cursor: pointer;\n  transition: color var(--transition-fast);\n}\n\n.btn-hostoo-guide-toggle:hover {\n  color: #86efac;\n  text-decoration: underline;\n}\n\n.info-icon {\n  font-size: 0.95rem;\n}\n\n.hostoo-size-counter {\n  font-family: var(--font-mono);\n  font-size: 0.78rem;\n  color: #64748b;\n  background: rgba(255, 255, 255, 0.03);\n  padding: 4px 10px;\n  border-radius: 6px;\n  border: 1px solid rgba(255, 255, 255, 0.06);\n}\n\n/* Expanded Panel */\n.hostoo-expanded-panel {\n  margin-top: 24px;\n  padding-top: 20px;\n  border-top: 1px dashed rgba(255, 255, 255, 0.1);\n  animation: fadeIn 0.3s ease-out;\n}\n\n.hostoo-files-grid {\n  display: grid;\n  grid-template-columns: repeat(2, 1fr);\n  gap: 10px;\n  margin-bottom: 22px;\n}\n\n.hostoo-file-card {\n  background: rgba(255, 255, 255, 0.02);\n  border: 1px solid rgba(255, 255, 255, 0.06);\n  border-radius: var(--radius-md);\n  padding: 10px 12px;\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n\n.file-icon {\n  font-size: 1.2rem;\n}\n\n.file-details {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  overflow: hidden;\n}\n\n.file-name {\n  font-family: var(--font-mono);\n  font-size: 0.82rem;\n  color: #f1f5f9;\n}\n\n.file-desc {\n  font-size: 0.72rem;\n  color: #64748b;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.file-status {\n  font-family: var(--font-mono);\n  font-size: 0.68rem;\n  font-weight: 700;\n  color: #4ade80;\n  background: rgba(34, 197, 94, 0.1);\n  padding: 2px 6px;\n  border-radius: 4px;\n  white-space: nowrap;\n}\n\n/* Code Viewer */\n.hostoo-code-viewer {\n  background: #060910;\n  border: 1px solid rgba(255, 255, 255, 0.08);\n  border-radius: var(--radius-md);\n  overflow: hidden;\n  margin-bottom: 20px;\n}\n\n.code-viewer-tabs {\n  display: flex;\n  background: rgba(255, 255, 255, 0.03);\n  border-bottom: 1px solid rgba(255, 255, 255, 0.08);\n  overflow-x: auto;\n}\n\n.tab-btn {\n  padding: 10px 14px;\n  background: transparent;\n  border: none;\n  border-bottom: 2px solid transparent;\n  color: #64748b;\n  font-family: var(--font-mono);\n  font-size: 0.78rem;\n  font-weight: 600;\n  cursor: pointer;\n  white-space: nowrap;\n  transition: all var(--transition-fast);\n}\n\n.tab-btn:hover {\n  color: #e2e8f0;\n}\n\n.tab-btn.active {\n  color: #4ade80;\n  border-bottom-color: #22c55e;\n  background: rgba(34, 197, 94, 0.08);\n}\n\n.code-tab-content {\n  display: none;\n  padding: 14px;\n}\n\n.code-tab-content.active {\n  display: block;\n}\n\n.code-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 10px;\n  font-size: 0.78rem;\n  color: #94a3b8;\n}\n\n.btn-copy-code {\n  background: rgba(255, 255, 255, 0.06);\n  color: #ffffff;\n  border: 1px solid rgba(255, 255, 255, 0.1);\n  font-size: 0.75rem;\n  font-weight: 600;\n  padding: 3px 8px;\n  border-radius: 4px;\n  cursor: pointer;\n  transition: all var(--transition-fast);\n}\n\n.btn-copy-code:hover {\n  background: #22c55e;\n  color: #000000;\n}\n\n.code-tab-content pre {\n  margin: 0;\n  padding: 12px;\n  background: #03050a;\n  border-radius: 6px;\n  overflow-x: auto;\n  max-height: 200px;\n}\n\n.code-tab-content code {\n  font-family: var(--font-mono);\n  font-size: 0.78rem;\n  color: #86efac;\n  line-height: 1.5;\n}\n\n/* Steps Summary */\n.hostoo-steps-summary {\n  background: rgba(255, 255, 255, 0.02);\n  border-left: 3px solid #22c55e;\n  padding: 14px 18px;\n  border-radius: 0 var(--radius-md) var(--radius-md) 0;\n}\n\n.hostoo-steps-summary h4 {\n  font-size: 0.9rem;\n  color: #ffffff;\n  margin-bottom: 8px;\n}\n\n.hostoo-steps-summary ol {\n  margin: 0;\n  padding-left: 18px;\n  font-size: 0.82rem;\n  color: #cbd5e1;\n  line-height: 1.6;\n}\n\n/* --- KEYFRAME ANIMATIONS --- */\n@keyframes pulse-dot {\n  0%, 100% { opacity: 1; transform: scale(1); }\n  50% { opacity: 0.4; transform: scale(0.85); }\n}\n\n@keyframes pulse-ring {\n  0% { transform: scale(1); opacity: 0.8; }\n  100% { transform: scale(1.6); opacity: 0; }\n}\n\n@keyframes blink {\n  0%, 100% { opacity: 1; }\n  50% { opacity: 0; }\n}\n\n/* --- RESPONSIVE BREAKPOINTS (MOBILE FIRST) --- */\n\n/* Mobile Header Brand Sizing (SEM FUNDO / TRANSPARENTE) */\n@media (max-width: 768px) {\n  .brand { width: 146px; flex-basis: 146px; }\n  .brand-image { width: 146px; height: 48px; padding: 0; border-radius: 0; }\n}\n\n/* Tablet & Mobile Layout Adaptations */\n@media (max-width: 1024px) {\n  .nav-desktop { display: none; }\n  .header-phone { display: none; }\n  .menu-toggle { display: flex; }\n  \n  .hero-container {\n    grid-template-columns: 1fr;\n    gap: 44px;\n    text-align: center;\n  }\n\n  .hero-subheadline {\n    margin-left: auto;\n    margin-right: auto;\n  }\n\n  .hero-ctas, .hero-microcopy {\n    justify-content: center;\n  }\n\n  .grid-4 { grid-template-columns: repeat(2, 1fr); }\n  .grid-3 { grid-template-columns: repeat(2, 1fr); }\n  .footer-top { grid-template-columns: repeat(2, 1fr); }\n}\n\n@media (max-width: 768px) {\n  .section {\n    padding-top: 70px;\n    padding-bottom: 70px;\n  }\n\n  .hero-title {\n    font-size: 2.35rem;\n  }\n\n  .section-title {\n    font-size: 1.95rem;\n  }\n\n  .grid-2, .grid-3, .grid-4 {\n    grid-template-columns: 1fr;\n  }\n\n  .form-grid {\n    grid-template-columns: 1fr;\n  }\n\n  .footer-top {\n    grid-template-columns: 1fr;\n    gap: 36px;\n  }\n\n  .footer-bottom {\n    flex-direction: column;\n    text-align: center;\n  }\n\n  .manifesto-box {\n    padding: 28px;\n  }\n\n  .metodo-step {\n    flex-direction: column;\n    gap: 18px;\n  }\n\n  .panel-nodes-grid {\n    grid-template-columns: 1fr;\n  }\n}\n\n/* Small Screens (360px Safe) */\n@media (max-width: 480px) {\n  .container {\n    padding-left: 18px;\n    padding-right: 18px;\n  }\n\n  .hero-title {\n    font-size: 1.9rem;\n  }\n\n  .btn {\n    width: 100%;\n  }\n\n  .form-card {\n    padding: 28px 20px;\n  }\n\n  .whatsapp-tooltip {\n    display: none;\n  }\n}\n\n/* Reduced Motion for Accessibility */\n@media (prefers-reduced-motion: reduce) {\n  *, *::before, *::after {\n    animation-duration: 0.01ms !important;\n    animation-iteration-count: 1 !important;\n    transition-duration: 0.01ms !important;\n    scroll-behavior: auto !important;\n  }\n}\n\n/* ==========================================\n   SAAS (sigmaOS) STYLES\n   ========================================== */\n.nav-highlight {\n  position: relative;\n}\n\n.nav-pill-saas {\n  background: linear-gradient(135deg, var(--accent-purple) 0%, var(--accent-blue) 100%);\n  color: #ffffff;\n  font-size: 0.7rem;\n  font-weight: 800;\n  padding: 2px 7px;\n  border-radius: 20px;\n  margin-right: 5px;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n  box-shadow: 0 0 10px rgba(139, 60, 255, 0.4);\n}\n\n.mobile-saas-link {\n  color: #a855f7 !important;\n  font-weight: 700 !important;\n}\n\n.sigma-os-section {\n  position: relative;\n  background: linear-gradient(180deg, #05070c 0%, #080c18 50%, #05070c 100%);\n  border-top: 1px solid var(--border-glass);\n  border-bottom: 1px solid var(--border-glass);\n}\n\n.section-tag-purple {\n  color: #c084fc;\n  border-color: rgba(192, 132, 252, 0.3);\n  background: rgba(192, 132, 252, 0.08);\n}\n\n.sigmaos-concept-banner {\n  position: relative;\n  width: 100%;\n  background: rgba(13, 17, 28, 0.78);\n  backdrop-filter: blur(28px);\n  -webkit-backdrop-filter: blur(28px);\n  border: 1px solid rgba(168, 85, 247, 0.28);\n  border-radius: 28px;\n  padding: clamp(28px, 4.5vw, 48px);\n  margin-bottom: 60px;\n  box-shadow: 0 35px 90px rgba(0, 0, 0, 0.72), \n              0 0 50px rgba(139, 60, 255, 0.12),\n              inset 0 1px 1px rgba(255, 255, 255, 0.12);\n  overflow: hidden;\n}\n\n.sigmaos-concept-banner::before {\n  content: '';\n  position: absolute;\n  top: 0;\n  left: 8%;\n  right: 8%;\n  height: 2px;\n  background: linear-gradient(90deg, transparent, rgba(168, 85, 247, 0.85), rgba(56, 189, 248, 0.85), transparent);\n}\n\n.concept-banner-grid {\n  display: grid;\n  grid-template-columns: 1.1fr 0.9fr;\n  gap: clamp(28px, 4vw, 48px);\n  align-items: center;\n}\n\n.concept-badge-wrap {\n  margin-bottom: 16px;\n}\n\n.concept-badge {\n  display: inline-flex;\n  align-items: center;\n  gap: 8px;\n  font-family: 'JetBrains Mono', monospace;\n  font-size: 0.74rem;\n  font-weight: 700;\n  color: #c084fc;\n  letter-spacing: 0.8px;\n  text-transform: uppercase;\n  background: rgba(168, 85, 247, 0.12);\n  border: 1px solid rgba(168, 85, 247, 0.32);\n  padding: 6px 14px;\n  border-radius: 20px;\n  box-shadow: 0 0 14px rgba(168, 85, 247, 0.15);\n}\n\n.concept-title {\n  font-size: clamp(1.8rem, 2.6vw, 2.35rem);\n  font-weight: 800;\n  line-height: 1.22;\n  letter-spacing: -0.02em;\n  margin-bottom: 18px;\n  color: #ffffff;\n}\n\n.text-gradient-purple {\n  background: linear-gradient(135deg, #c084fc 0%, #38bdf8 100%);\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  display: inline;\n}\n\n.concept-desc {\n  font-size: clamp(0.98rem, 1.15vw, 1.05rem);\n  color: #cbd5e1;\n  line-height: 1.62;\n  margin-bottom: 28px;\n}\n\n.concept-pillars-grid {\n  display: grid;\n  grid-template-columns: repeat(2, 1fr);\n  gap: 16px;\n}\n\n.concept-pillar {\n  display: flex;\n  align-items: flex-start;\n  gap: 14px;\n  background: rgba(255, 255, 255, 0.035);\n  border: 1px solid rgba(255, 255, 255, 0.08);\n  padding: 16px;\n  border-radius: 18px;\n  transition: all var(--transition-fast);\n}\n\n.concept-pillar:hover {\n  background: rgba(168, 85, 247, 0.08);\n  border-color: rgba(168, 85, 247, 0.35);\n  transform: translateY(-2px);\n  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);\n}\n\n.pillar-icon-box {\n  width: 40px;\n  height: 40px;\n  flex-shrink: 0;\n  background: rgba(168, 85, 247, 0.14);\n  border: 1px solid rgba(168, 85, 247, 0.3);\n  border-radius: 12px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-size: 1.2rem;\n  box-shadow: 0 0 12px rgba(168, 85, 247, 0.15);\n}\n\n.pillar-text strong {\n  display: block;\n  font-size: 0.92rem;\n  font-weight: 700;\n  color: #ffffff;\n  margin-bottom: 3px;\n}\n\n.pillar-text span {\n  font-size: 0.82rem;\n  color: #94a3b8;\n  line-height: 1.4;\n  display: block;\n}\n\n/* Dashboard Mock Window */\n.concept-card-preview {\n  width: 100%;\n}\n\n.sigmaos-window-frame {\n  background: rgba(13, 17, 28, 0.92);\n  border: 1px solid rgba(168, 85, 247, 0.35);\n  border-radius: 20px;\n  overflow: hidden;\n  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.6), 0 0 25px rgba(139, 60, 255, 0.15);\n  transition: all var(--transition-medium);\n}\n\n.sigmaos-window-frame:hover {\n  border-color: rgba(56, 189, 248, 0.5);\n  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.7), 0 0 35px rgba(56, 189, 248, 0.2);\n}\n\n.sigmaos-window-header {\n  background: #161b2e;\n  padding: 12px 16px;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  border-bottom: 1px solid rgba(255, 255, 255, 0.08);\n}\n\n.sigmaos-window-header .dot {\n  width: 10px;\n  height: 10px;\n  border-radius: 50%;\n}\n\n.sigmaos-window-header .dot.red { background: #ef4444; }\n.sigmaos-window-header .dot.yellow { background: #f59e0b; }\n.sigmaos-window-header .dot.green { background: #10b981; }\n\n.sigmaos-window-header .window-title {\n  font-family: monospace;\n  font-size: 0.8rem;\n  color: var(--text-muted);\n  margin-left: 8px;\n}\n\n.sigmaos-window-body {\n  padding: 24px;\n}\n\n.dash-stat-row {\n  display: grid;\n  grid-template-columns: repeat(2, 1fr);\n  gap: 16px;\n  margin-bottom: 20px;\n}\n\n.dash-stat-box {\n  background: rgba(255, 255, 255, 0.04);\n  border: 1px solid rgba(255, 255, 255, 0.08);\n  padding: 16px;\n  border-radius: var(--radius-sm);\n}\n\n.stat-label {\n  font-size: 0.78rem;\n  color: var(--text-muted);\n  display: block;\n}\n\n.stat-value {\n  font-size: 1.6rem;\n  font-weight: 800;\n  display: block;\n  margin: 4px 0;\n}\n\n.text-accent { color: #a855f7; }\n.text-green { color: #10b981; }\n\n.stat-sub {\n  font-size: 0.75rem;\n  color: #10b981;\n}\n\n.dash-workflow-card {\n  background: rgba(139, 60, 255, 0.08);\n  border: 1px solid rgba(139, 60, 255, 0.25);\n  border-radius: var(--radius-sm);\n  padding: 16px;\n  margin-bottom: 20px;\n}\n\n.workflow-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  font-size: 0.85rem;\n  font-weight: 700;\n  color: #ffffff;\n  margin-bottom: 8px;\n}\n\n.status-live {\n  color: #10b981;\n  font-size: 0.72rem;\n  font-weight: 800;\n}\n\n.workflow-text {\n  font-size: 0.88rem;\n  color: #e2e8f0;\n  line-height: 1.4;\n  margin: 0;\n}\n\n.dash-checklist-tags {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 8px;\n}\n\n.dash-checklist-tags span {\n  background: rgba(255, 255, 255, 0.06);\n  border: 1px solid rgba(255, 255, 255, 0.1);\n  padding: 4px 10px;\n  border-radius: 12px;\n  font-size: 0.78rem;\n  color: #cbd5e1;\n}\n\n/* Sectors Selector Grid (Master Container Estilo Hero) */\n.sigmaos-sectors-wrapper {\n  position: relative;\n  width: 100%;\n  background: rgba(13, 17, 28, 0.78);\n  backdrop-filter: blur(28px);\n  -webkit-backdrop-filter: blur(28px);\n  border: 1px solid rgba(168, 85, 247, 0.28);\n  border-radius: 28px;\n  padding: clamp(28px, 4.5vw, 52px);\n  margin-top: 50px;\n  margin-bottom: 60px;\n  box-shadow: 0 35px 90px rgba(0, 0, 0, 0.75), \n              0 0 60px rgba(139, 60, 255, 0.15),\n              inset 0 1px 1px rgba(255, 255, 255, 0.15);\n  overflow: hidden;\n}\n\n.sigmaos-sectors-wrapper::before {\n  content: '';\n  position: absolute;\n  top: 0;\n  left: 8%;\n  right: 8%;\n  height: 2px;\n  background: linear-gradient(90deg, transparent, rgba(168, 85, 247, 0.85), rgba(56, 189, 248, 0.85), transparent);\n}\n\n.sector-hero-title {\n  font-size: clamp(1.8rem, 2.8vw, 2.5rem);\n  font-weight: 800;\n  line-height: 1.2;\n  letter-spacing: -0.02em;\n  color: #ffffff;\n  margin-top: 12px;\n  margin-bottom: 12px;\n}\n\n.sector-hero-subtitle {\n  font-size: clamp(0.98rem, 1.15vw, 1.08rem);\n  color: #cbd5e1;\n  max-width: 800px;\n  margin: 0 auto 32px auto;\n  line-height: 1.6;\n}\n\n/* Palco Galáctico de Setores com Núcleo Sigma OS */\n.sector-galaxy-stage {\n  position: relative;\n  width: 100%;\n  background: radial-gradient(ellipse at top center, rgba(168, 85, 247, 0.16) 0%, rgba(13, 17, 28, 0.9) 70%);\n  border: 1px solid rgba(168, 85, 247, 0.35);\n  border-radius: 24px;\n  padding: 36px 24px 32px 24px;\n  margin-bottom: 36px;\n  box-shadow: inset 0 0 50px rgba(139, 60, 255, 0.12),\n              0 15px 40px rgba(0, 0, 0, 0.6);\n  overflow: hidden;\n}\n\n.sector-galaxy-nebula {\n  position: absolute;\n  top: 30%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 90%;\n  height: 280px;\n  background: radial-gradient(circle, rgba(168, 85, 247, 0.22) 0%, rgba(56, 189, 248, 0.12) 45%, transparent 75%);\n  filter: blur(40px);\n  pointer-events: none;\n  z-index: 0;\n}\n\n.sector-galaxy-stars {\n  position: absolute;\n  inset: 0;\n  background-image: \n    radial-gradient(1px 1px at 15% 20%, rgba(255, 255, 255, 0.7), transparent),\n    radial-gradient(1.5px 1.5px at 85% 30%, rgba(168, 85, 247, 0.8), transparent),\n    radial-gradient(1px 1px at 50% 15%, rgba(56, 189, 248, 0.8), transparent),\n    radial-gradient(1.5px 1.5px at 25% 75%, rgba(255, 255, 255, 0.6), transparent),\n    radial-gradient(1px 1px at 75% 80%, rgba(168, 85, 247, 0.7), transparent);\n  pointer-events: none;\n  z-index: 0;\n}\n\n.sector-orbit-ring {\n  position: absolute;\n  top: 25%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  border-radius: 50%;\n  border: 1px dashed rgba(168, 85, 247, 0.22);\n  pointer-events: none;\n  z-index: 0;\n}\n\n.sector-orbit-ring.ring-inner {\n  width: 280px;\n  height: 140px;\n  animation: orbitRotate 35s linear infinite;\n}\n\n.sector-orbit-ring.ring-middle {\n  width: 520px;\n  height: 220px;\n  animation: orbitRotate 55s linear infinite reverse;\n}\n\n.sector-orbit-ring.ring-outer {\n  width: 800px;\n  height: 320px;\n}\n\n@keyframes orbitRotate {\n  from { transform: translate(-50%, -50%) rotate(0deg); }\n  to { transform: translate(-50%, -50%) rotate(360deg); }\n}\n\n/* Núcleo Central Sigma OS */\n.sector-galaxy-core {\n  position: relative;\n  z-index: 3;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  margin-bottom: 32px;\n}\n\n.core-energy-halo {\n  position: absolute;\n  width: 140px;\n  height: 140px;\n  border-radius: 50%;\n  background: radial-gradient(circle, rgba(168, 85, 247, 0.5) 0%, rgba(56, 189, 248, 0.2) 60%, transparent 100%);\n  filter: blur(15px);\n  animation: coreGlowPulse 3s ease-in-out infinite alternate;\n}\n\n@keyframes coreGlowPulse {\n  0% { transform: scale(0.9); opacity: 0.6; }\n  100% { transform: scale(1.2); opacity: 0.95; }\n}\n\n.core-badge {\n  position: relative;\n  background: linear-gradient(135deg, rgba(20, 15, 38, 0.95) 0%, rgba(13, 24, 48, 0.95) 100%);\n  border: 2px solid rgba(168, 85, 247, 0.7);\n  box-shadow: 0 0 30px rgba(168, 85, 247, 0.45),\n              0 0 60px rgba(56, 189, 248, 0.25),\n              inset 0 0 20px rgba(168, 85, 247, 0.25);\n  padding: 12px 28px;\n  border-radius: 40px;\n  display: inline-flex;\n  align-items: center;\n  gap: 14px;\n  backdrop-filter: blur(16px);\n}\n\n.core-symbol {\n  font-size: 2rem;\n  font-weight: 900;\n  background: linear-gradient(135deg, #c084fc 0%, #38bdf8 100%);\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  text-shadow: 0 0 20px rgba(168, 85, 247, 0.8);\n}\n\n.core-title {\n  font-size: 1.25rem;\n  font-weight: 800;\n  color: #ffffff;\n  letter-spacing: 0.5px;\n}\n\n.core-subtag {\n  font-size: 0.7rem;\n  font-weight: 800;\n  color: #38bdf8;\n  background: rgba(56, 189, 248, 0.15);\n  border: 1px solid rgba(56, 189, 248, 0.35);\n  padding: 4px 10px;\n  border-radius: 20px;\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  letter-spacing: 0.5px;\n}\n\n.core-subtag .status-dot {\n  width: 7px;\n  height: 7px;\n  background-color: #10b981;\n  border-radius: 50%;\n  box-shadow: 0 0 8px #10b981;\n  animation: pulseDot 2s infinite;\n}\n\n/* Grid das Pílulas de Setores na Galáxia */\n.sector-galaxy-grid {\n  position: relative;\n  z-index: 2;\n  display: flex;\n  flex-wrap: wrap;\n  gap: 12px;\n  justify-content: center;\n  max-width: 1100px;\n  margin: 0 auto;\n}\n\n.sector-galaxy-grid .sector-tab {\n  background: rgba(15, 23, 42, 0.82);\n  border: 1px solid rgba(168, 85, 247, 0.28);\n  color: #e2e8f0;\n  padding: 10px 20px;\n  border-radius: 28px;\n  font-size: 0.88rem;\n  font-weight: 600;\n  cursor: pointer;\n  backdrop-filter: blur(14px);\n  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);\n  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.35), inset 0 1px 1px rgba(255, 255, 255, 0.12);\n}\n\n.sector-galaxy-grid .sector-tab:hover {\n  background: rgba(168, 85, 247, 0.22);\n  border-color: rgba(168, 85, 247, 0.65);\n  color: #ffffff;\n  transform: translateY(-3px) scale(1.03);\n  box-shadow: 0 8px 25px rgba(168, 85, 247, 0.35), 0 0 15px rgba(56, 189, 248, 0.2);\n}\n\n.sector-galaxy-grid .sector-tab.active {\n  background: linear-gradient(135deg, #a855f7 0%, #38bdf8 100%);\n  color: #ffffff;\n  font-weight: 700;\n  border-color: transparent;\n  transform: translateY(-3px) scale(1.05);\n  box-shadow: 0 10px 30px rgba(168, 85, 247, 0.55), 0 0 20px rgba(56, 189, 248, 0.45);\n}\n\n.sector-tabs-grid {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 10px;\n  justify-content: center;\n  margin-bottom: 36px;\n}\n\n.sector-tab {\n  background: rgba(255, 255, 255, 0.04);\n  border: 1px solid rgba(255, 255, 255, 0.12);\n  color: #cbd5e1;\n  padding: 10px 18px;\n  border-radius: 24px;\n  font-size: 0.88rem;\n  font-weight: 600;\n  cursor: pointer;\n  backdrop-filter: blur(8px);\n  transition: all var(--transition-fast);\n}\n\n.sector-tab:hover {\n  background: rgba(168, 85, 247, 0.16);\n  border-color: rgba(168, 85, 247, 0.45);\n  color: #ffffff;\n  transform: translateY(-2px);\n  box-shadow: 0 6px 20px rgba(168, 85, 247, 0.25);\n}\n\n.sector-tab.active {\n  background: linear-gradient(135deg, #a855f7 0%, #38bdf8 100%);\n  color: #ffffff;\n  border-color: transparent;\n  font-weight: 700;\n  box-shadow: 0 8px 25px rgba(168, 85, 247, 0.45);\n  transform: translateY(-2px);\n}\n\n/* Sector Display Card */\n.sector-display-card {\n  margin-bottom: 10px;\n}\n\n.sector-card-grid {\n  gap: 24px;\n}\n\n.sector-pain-box, .sector-solution-box {\n  background: rgba(13, 17, 28, 0.85);\n  border-radius: 22px;\n  padding: 32px;\n  position: relative;\n  backdrop-filter: blur(16px);\n  transition: all var(--transition-fast);\n}\n\n.sector-pain-box {\n  border: 1px solid rgba(239, 68, 68, 0.35);\n  box-shadow: 0 15px 40px rgba(239, 68, 68, 0.1);\n}\n\n.sector-pain-box:hover {\n  border-color: rgba(239, 68, 68, 0.55);\n  box-shadow: 0 20px 50px rgba(239, 68, 68, 0.18);\n}\n\n.sector-solution-box {\n  border: 1px solid rgba(168, 85, 247, 0.4);\n  box-shadow: 0 15px 40px rgba(168, 85, 247, 0.15);\n}\n\n.sector-solution-box:hover {\n  border-color: rgba(56, 189, 248, 0.6);\n  box-shadow: 0 20px 50px rgba(56, 189, 248, 0.22);\n}\n\n.box-badge {\n  display: inline-block;\n  font-size: 0.72rem;\n  font-weight: 800;\n  padding: 6px 12px;\n  border-radius: 20px;\n  margin-bottom: 14px;\n  letter-spacing: 0.5px;\n}\n\n.badge-red {\n  background: rgba(239, 68, 68, 0.15);\n  color: #fca5a5;\n  border: 1px solid rgba(239, 68, 68, 0.3);\n}\n\n.badge-purple {\n  background: rgba(139, 60, 255, 0.15);\n  color: #d8b4fe;\n  border: 1px solid rgba(139, 60, 255, 0.3);\n}\n\n.sector-card-title {\n  font-size: 1.4rem;\n  font-weight: 800;\n  color: #ffffff;\n  margin-bottom: 8px;\n}\n\n.sector-intro-text {\n  font-size: 0.92rem;\n  color: var(--text-secondary);\n  margin-bottom: 20px;\n}\n\n.pain-list, .solution-list {\n  list-style: none;\n  padding: 0;\n  margin: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.pain-list li, .solution-list li {\n  display: flex;\n  align-items: flex-start;\n  gap: 12px;\n  font-size: 0.95rem;\n  color: #f1f5f9;\n  line-height: 1.5;\n}\n\n.cross-icon {\n  font-size: 0.9rem;\n  margin-top: 2px;\n}\n\n.check-icon {\n  color: #10b981;\n  font-weight: 800;\n  margin-top: 2px;\n}\n\n/* CTA Banner Principal */\n.sigmaos-cta-banner {\n  background: linear-gradient(135deg, rgba(30, 27, 75, 0.9) 0%, rgba(15, 23, 42, 0.95) 100%);\n  border: 2px solid rgba(139, 60, 255, 0.4);\n  border-radius: var(--radius-lg);\n  padding: 48px 32px;\n  position: relative;\n  overflow: hidden;\n  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5), inset 0 0 30px rgba(139, 60, 255, 0.15);\n}\n\n.cta-inner-glow {\n  position: absolute;\n  top: -50%;\n  left: 50%;\n  transform: translateX(-50%);\n  width: 400px;\n  height: 400px;\n  background: radial-gradient(circle, rgba(139, 60, 255, 0.25) 0%, transparent 70%);\n  pointer-events: none;\n}\n\n.cta-badge {\n  display: inline-block;\n  font-size: 0.78rem;\n  font-weight: 800;\n  color: #38bdf8;\n  letter-spacing: 1px;\n  margin-bottom: 16px;\n  background: rgba(56, 189, 248, 0.1);\n  border: 1px solid rgba(56, 189, 248, 0.3);\n  padding: 4px 14px;\n  border-radius: 20px;\n}\n\n.cta-heading {\n  font-size: 1.85rem;\n  font-weight: 800;\n  color: #ffffff;\n  line-height: 1.4;\n  max-width: 860px;\n  margin: 0 auto 16px auto;\n}\n\n.highlight-yellow {\n  color: #fbbf24;\n  text-decoration: underline;\n  text-decoration-color: rgba(251, 191, 36, 0.4);\n}\n\n.highlight-pain {\n  color: #f87171;\n}\n\n.cta-subtext {\n  font-size: 1.1rem;\n  color: #cbd5e1;\n  max-width: 720px;\n  margin: 0 auto 28px auto;\n  line-height: 1.6;\n}\n\n.cta-button-wrap {\n  margin-bottom: 16px;\n}\n\n.btn-cta-sigmaos {\n  background: linear-gradient(135deg, #a855f7 0%, #3b82f6 100%);\n  padding: 18px 36px;\n  font-size: 1.1rem;\n  box-shadow: 0 10px 30px rgba(168, 85, 247, 0.5);\n  border: 1px solid rgba(255, 255, 255, 0.2);\n}\n\n.btn-cta-sigmaos:hover {\n  transform: translateY(-3px) scale(1.02);\n  box-shadow: 0 15px 40px rgba(168, 85, 247, 0.7);\n}\n\n.cta-microcopy {\n  display: block;\n  font-size: 0.82rem;\n  color: var(--text-muted);\n}\n\n@media (max-width: 768px) {\n  .concept-pillars-grid {\n    grid-template-columns: 1fr;\n  }\n  .sigmaos-concept-banner {\n    padding: 24px;\n  }\n  .cta-heading {\n    font-size: 1.4rem;\n  }\n}\n\n/* Hero e Highlights específicos da Página sigmaOS.html */\n.hero-saas {\n  padding-top: 130px;\n  padding-bottom: 70px;\n  background: radial-gradient(circle at 50% 20%, rgba(139, 60, 255, 0.18) 0%, rgba(5, 7, 12, 0.98) 70%);\n}\n\n.hero-saas .hero-container {\n  width: 100%;\n  max-width: 100%;\n  padding-left: clamp(16px, 3.5vw, 48px);\n  padding-right: clamp(16px, 3.5vw, 48px);\n}\n\n/* Container Único Master do Hero SaaS — 100% Full Width Responsivo */\n.hero-unified-container {\n  position: relative;\n  width: 100%;\n  max-width: 100%;\n  background: rgba(13, 17, 28, 0.78);\n  backdrop-filter: blur(28px);\n  -webkit-backdrop-filter: blur(28px);\n  border: 1px solid rgba(168, 85, 247, 0.28);\n  border-radius: 28px;\n  padding: clamp(28px, 4.5vw, 56px);\n  box-shadow: 0 35px 90px rgba(0, 0, 0, 0.75), \n              0 0 60px rgba(139, 60, 255, 0.15),\n              inset 0 1px 1px rgba(255, 255, 255, 0.15);\n  overflow: hidden;\n}\n\n.hero-unified-container::before {\n  content: '';\n  position: absolute;\n  top: 0;\n  left: 8%;\n  right: 8%;\n  height: 2px;\n  background: linear-gradient(90deg, transparent, rgba(168, 85, 247, 0.85), rgba(56, 189, 248, 0.85), transparent);\n}\n\n/* ESCALA DE IMPORTÂNCIA / HIERARQUIA TIPOGRÁFICA */\n.hero-saas .hero-title {\n  font-size: clamp(2.2rem, 3.8vw, 3.35rem);\n  font-weight: 800;\n  line-height: 1.15;\n  letter-spacing: -0.03em;\n  margin-bottom: 20px;\n  color: #ffffff;\n}\n\n.hero-saas .hero-title .text-gradient {\n  background: linear-gradient(135deg, #ffffff 15%, #c084fc 60%, #38bdf8 100%);\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  display: inline-block;\n}\n\n.hero-saas .hero-description {\n  font-size: clamp(1.02rem, 1.25vw, 1.15rem);\n  line-height: 1.65;\n  color: #cbd5e1;\n  max-width: 580px;\n  margin-bottom: 32px;\n}\n\n.btn-hero-saas {\n  background: linear-gradient(135deg, var(--accent-purple) 0%, var(--accent-blue) 100%);\n  box-shadow: 0 10px 30px rgba(139, 60, 255, 0.45);\n  font-weight: 700;\n  padding: 14px 28px;\n  font-size: 0.98rem;\n}\n\n.saas-hero-highlights {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 12px;\n  margin-top: 32px;\n  padding-top: 24px;\n  border-top: 1px solid rgba(255, 255, 255, 0.08);\n}\n\n.saas-highlight-item {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  background: rgba(255, 255, 255, 0.04);\n  border: 1px solid rgba(255, 255, 255, 0.09);\n  padding: 8px 16px;\n  border-radius: 30px;\n  font-size: 0.84rem;\n  font-weight: 600;\n  color: #e2e8f0;\n  transition: all var(--transition-fast);\n}\n\n.saas-highlight-item:hover {\n  background: rgba(168, 85, 247, 0.12);\n  border-color: rgba(168, 85, 247, 0.35);\n  color: #ffffff;\n  transform: translateY(-2px);\n}\n\n.saas-highlight-item .hl-icon {\n  font-size: 0.95rem;\n}\n\n/* Hero 2-Column Grid Layout — Full Width Expansion */\n.hero-saas-grid {\n  display: grid;\n  grid-template-columns: 1fr 1.15fr;\n  gap: clamp(32px, 4.5vw, 64px);\n  align-items: center;\n  width: 100%;\n}\n\n.hero-content-left {\n  text-align: left;\n}\n\n.hero-content-left .hero-tag-wrap {\n  justify-content: flex-start;\n}\n\n.hero-content-left .hero-actions {\n  justify-content: flex-start;\n}\n\n/* Ecosystem Header Badges (Alinhados no topo do lado direito como na imagem) */\n.hero-visual-header {\n  width: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  gap: 12px;\n  margin-bottom: 16px;\n  padding-bottom: 0;\n  border-bottom: none;\n}\n\n.visual-badge {\n  font-family: 'JetBrains Mono', monospace;\n  font-size: 0.7rem;\n  font-weight: 700;\n  color: #c084fc;\n  letter-spacing: 0.6px;\n  text-transform: uppercase;\n  background: rgba(168, 85, 247, 0.14);\n  border: 1px solid rgba(168, 85, 247, 0.35);\n  padding: 5px 13px;\n  border-radius: 20px;\n  box-shadow: 0 0 12px rgba(168, 85, 247, 0.15);\n}\n\n.visual-status {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  font-family: 'JetBrains Mono', monospace;\n  font-size: 0.68rem;\n  font-weight: 600;\n  color: #34d399;\n  background: rgba(52, 211, 153, 0.12);\n  border: 1px solid rgba(52, 211, 153, 0.3);\n  padding: 5px 13px;\n  border-radius: 20px;\n}\n\n.visual-status .status-dot {\n  width: 7px;\n  height: 7px;\n  background-color: #34d399;\n  border-radius: 50%;\n  box-shadow: 0 0 8px #34d399;\n  animation: pulseGreen 2s infinite;\n}\n\n@keyframes pulseGreen {\n  0% { opacity: 0.4; transform: scale(0.9); }\n  50% { opacity: 1; transform: scale(1.1); }\n  100% { opacity: 0.4; transform: scale(0.9); }\n}\n\n/* Ecosystem Container (Espaçoso Galáxia de Sistemas em Órbita) */\n.hero-ecosystem-visual {\n  position: relative;\n  width: 100%;\n  max-width: 580px;\n  margin: 0 auto;\n}\n\n.ecosystem-container {\n  position: relative;\n  width: 100%;\n  aspect-ratio: 1 / 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n/* Galaxy Nebula & Particles Effects */\n.galaxy-nebula-glow {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  background: radial-gradient(circle at 50% 50%, rgba(168, 85, 247, 0.22) 0%, rgba(56, 189, 248, 0.1) 40%, transparent 75%);\n  border-radius: 50%;\n  pointer-events: none;\n  filter: blur(20px);\n  animation: pulseNebula 8s ease-in-out infinite alternate;\n}\n\n@keyframes pulseNebula {\n  0% { transform: scale(0.9) rotate(0deg); opacity: 0.6; }\n  100% { transform: scale(1.1) rotate(15deg); opacity: 0.95; }\n}\n\n/* Galaxy Orbit Rings */\n.galaxy-ring {\n  position: absolute;\n  border-radius: 50%;\n  border: 1px dashed rgba(168, 85, 247, 0.3);\n  pointer-events: none;\n  box-shadow: 0 0 15px rgba(168, 85, 247, 0.08);\n}\n\n.galaxy-ring-1 {\n  width: 92%;\n  height: 92%;\n  border-color: rgba(168, 85, 247, 0.35);\n  animation: spinSlow 50s linear infinite;\n}\n\n.galaxy-ring-2 {\n  width: 70%;\n  height: 70%;\n  border-color: rgba(56, 189, 248, 0.35);\n  animation: spinReverse 35s linear infinite;\n}\n\n.galaxy-ring-3 {\n  width: 46%;\n  height: 46%;\n  border-color: rgba(192, 132, 252, 0.4);\n  animation: spinSlow 25s linear infinite;\n}\n\n@keyframes spinSlow {\n  from { transform: rotate(0deg); }\n  to { transform: rotate(360deg); }\n}\n\n@keyframes spinReverse {\n  from { transform: rotate(360deg); }\n  to { transform: rotate(0deg); }\n}\n\n/* SVG Lines Overlay & Pulsing Laser Dots */\n.ecosystem-svg-lines {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  pointer-events: none;\n  z-index: 1;\n}\n\n.pulse-line {\n  animation: strokePulse 3s ease-in-out infinite alternate;\n}\n\n@keyframes strokePulse {\n  0% { stroke-opacity: 0.4; }\n  100% { stroke-opacity: 0.95; }\n}\n\n.laser-dot {\n  filter: drop-shadow(0 0 6px #c084fc);\n  animation: laserFlow 4s linear infinite;\n}\n\n.dot-1 { animation-delay: 0s; }\n.dot-2 { animation-delay: 0.5s; }\n.dot-3 { animation-delay: 1s; }\n.dot-4 { animation-delay: 1.5s; }\n.dot-5 { animation-delay: 2s; }\n.dot-6 { animation-delay: 2.5s; }\n.dot-7 { animation-delay: 3s; }\n\n/* Central SigmaOS Node */\n.central-sigma-node {\n  position: relative;\n  z-index: 5;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.galaxy-energy-ring {\n  position: absolute;\n  width: 145px;\n  height: 145px;\n  border: 1px solid rgba(168, 85, 247, 0.5);\n  border-radius: 50%;\n  animation: galaxyPulseRing 2.5s ease-out infinite;\n  pointer-events: none;\n}\n\n@keyframes galaxyPulseRing {\n  0% { transform: scale(0.7); opacity: 1; border-color: rgba(168, 85, 247, 0.8); }\n  100% { transform: scale(1.4); opacity: 0; border-color: rgba(56, 189, 248, 0.1); }\n}\n\n.sigma-core-glow {\n  position: absolute;\n  width: 135px;\n  height: 135px;\n  background: radial-gradient(circle, rgba(168, 85, 247, 0.75) 0%, rgba(56, 189, 248, 0.35) 60%, transparent 80%);\n  border-radius: 50%;\n  filter: blur(16px);\n  animation: pulseGlow 3s ease-in-out infinite alternate;\n}\n\n.sigma-symbol-badge {\n  position: relative;\n  width: 110px;\n  height: 110px;\n  background: linear-gradient(135deg, #1e1b4b 0%, #0f172a 100%);\n  border: 2px solid #c084fc;\n  border-radius: 50%;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  box-shadow: 0 0 40px rgba(168, 85, 247, 0.7), \n              0 0 20px rgba(56, 189, 248, 0.4),\n              inset 0 0 20px rgba(168, 85, 247, 0.4);\n  transition: transform var(--transition-medium);\n}\n\n.sigma-symbol-badge:hover {\n  transform: scale(1.06);\n  border-color: #38bdf8;\n  box-shadow: 0 0 50px rgba(56, 189, 248, 0.8), inset 0 0 25px rgba(56, 189, 248, 0.5);\n}\n\n.sigma-letter {\n  font-family: 'Plus Jakarta Sans', sans-serif;\n  font-size: 2.9rem;\n  font-weight: 900;\n  background: linear-gradient(135deg, #ffffff 0%, #e9d5ff 50%, #38bdf8 100%);\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n  line-height: 1;\n  filter: drop-shadow(0 2px 8px rgba(168, 85, 247, 0.5));\n}\n\n.sigma-label {\n  font-size: 0.75rem;\n  font-weight: 800;\n  color: #38bdf8;\n  letter-spacing: 0.8px;\n  margin-top: 2px;\n  text-transform: uppercase;\n  text-shadow: 0 0 10px rgba(56, 189, 248, 0.6);\n}\n\n@keyframes pulseGlow {\n  0% { transform: scale(0.92); opacity: 0.7; }\n  100% { transform: scale(1.18); opacity: 1; }\n}\n\n/* Software Nodes */\n.software-node {\n  position: absolute;\n  z-index: 4;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  background: rgba(15, 23, 42, 0.92);\n  border: 1px solid rgba(168, 85, 247, 0.4);\n  padding: 8px 13px;\n  border-radius: 22px;\n  backdrop-filter: blur(12px);\n  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6), 0 0 12px rgba(168, 85, 247, 0.2);\n  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n  white-space: nowrap;\n}\n\n.software-node:hover {\n  transform: scale(1.08) translateY(-3px) !important;\n  border-color: #38bdf8;\n  box-shadow: 0 12px 28px rgba(56, 189, 248, 0.4);\n  z-index: 10;\n}\n\n.software-node .node-icon {\n  font-size: 1.15rem;\n  line-height: 1;\n}\n\n.software-node .node-info {\n  display: flex;\n  flex-direction: column;\n}\n\n.software-node .node-title {\n  font-size: 0.82rem;\n  font-weight: 800;\n  color: #ffffff;\n  line-height: 1.2;\n}\n\n.software-node .node-sub {\n  font-size: 0.66rem;\n  color: #94a3b8;\n}\n\n/* Mini Floating Sigma Symbols */\n.mini-sigma-node {\n  position: absolute;\n  z-index: 3;\n  display: flex;\n  align-items: center;\n  gap: 4px;\n  background: rgba(30, 27, 75, 0.75);\n  border: 1px solid rgba(192, 132, 252, 0.35);\n  padding: 4px 9px;\n  border-radius: 14px;\n  font-size: 0.7rem;\n  color: #c084fc;\n  backdrop-filter: blur(6px);\n  animation: floatMini 4s ease-in-out infinite alternate;\n}\n\n.mini-sigma-node .mini-sigma {\n  font-weight: 900;\n  color: #fbbf24;\n}\n\n.mini-sigma-node .mini-tag {\n  font-size: 0.64rem;\n  font-weight: 700;\n  color: #cbd5e1;\n}\n\n.sigma-float-1 { animation-delay: 0s; }\n.sigma-float-2 { animation-delay: 1s; }\n.sigma-float-3 { animation-delay: 2s; }\n.sigma-float-4 { animation-delay: 3s; }\n\n@keyframes floatMini {\n  0% { transform: translateY(0px); }\n  100% { transform: translateY(-8px); }\n}\n\n/* Mobile & Tablet Responsiveness for Hero SaaS Container */\n@media (max-width: 1024px) {\n  .hero-saas .hero-container {\n    padding-left: clamp(12px, 3vw, 24px);\n    padding-right: clamp(12px, 3vw, 24px);\n  }\n  .hero-saas-grid {\n    grid-template-columns: 1fr;\n    text-align: center;\n    gap: 40px;\n  }\n  .hero-content-left {\n    text-align: center;\n  }\n  .hero-content-left .hero-tag-wrap,\n  .hero-content-left .hero-actions,\n  .hero-content-left .saas-hero-highlights {\n    justify-content: center;\n  }\n  .hero-saas .hero-description {\n    margin-left: auto;\n    margin-right: auto;\n  }\n  .hero-visual-header {\n    justify-content: center;\n  }\n  .hero-ecosystem-visual {\n    max-width: 500px;\n    margin-top: 12px;\n  }\n  .concept-banner-grid {\n    grid-template-columns: 1fr;\n    gap: 36px;\n  }\n}\n\n@media (max-width: 640px) {\n  .hero-saas {\n    padding-top: 100px;\n    padding-bottom: 50px;\n  }\n  .hero-unified-container,\n  .sigmaos-concept-banner {\n    padding: 20px 16px;\n    border-radius: 20px;\n  }\n  .concept-pillars-grid {\n    grid-template-columns: 1fr;\n    gap: 12px;\n  }\n  .hero-saas .hero-title {\n    font-size: 1.8rem;\n    line-height: 1.2;\n  }\n  .hero-saas .hero-description {\n    font-size: 0.95rem;\n    margin-bottom: 24px;\n  }\n  .hero-ecosystem-visual {\n    max-width: 340px;\n  }\n  .software-node {\n    padding: 5px 8px;\n    border-radius: 16px;\n  }\n  .software-node .node-icon {\n    font-size: 0.95rem;\n  }\n  .software-node .node-title {\n    font-size: 0.7rem;\n  }\n  .software-node .node-sub {\n    font-size: 0.55rem;\n  }\n  .central-sigma-node .sigma-symbol-badge {\n    width: 85px;\n    height: 85px;\n  }\n  .sigma-letter {\n    font-size: 2.2rem;\n  }\n  .mini-sigma-node {\n    padding: 3px 6px;\n    font-size: 0.6rem;\n  }\n}\n\n"
__vite__updateStyle(__vite__id, __vite__css)
import.meta.hot.accept()
import.meta.hot.prune(() => __vite__removeStyle(__vite__id))