/* ===== MARTIN TOOLS - DESIGN SYSTEM (Unificado) ===== */

:root {
  /* Cores Canonicas */
  --primary: #004481; /* Azul MSG */
  --primary-hover: #003366;
  --primary-dark: #002244;
  --primary-light: #1a5a9e;
  --accent: #3B82F6;
  --secondary: #6c757d;
  --bg-color: #f4f6f9;
  --surface: #ffffff;
  --text: #1e293b;
  --text-main: #1e293b;
  --text-muted: #475569;
  --text-light: #64748b;
  --danger: #dc3545;
  --success: #28a745;
  --warning: #ffc107;
  --border: #dee2e6;
  
  /* Espacamentos Canonicos (Usar sempre estas unidades) */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2rem;
  
  /* Bordas e Sombras */
  --radius-md: 6px;
  --shadow-sm: 0 2px 4px rgba(0,0,0,0.05);
  --shadow-md: 0 4px 8px rgba(0,0,0,0.1);
  
  /* Fontes */
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', 'SFMono-Regular', Consolas, monospace;
  --font-tech: 'Inter', sans-serif;
  --font-sub: 'Inter', sans-serif;
  --font-head: 'Oswald', sans-serif;
  --header-h: 86px;
}

/* ===== Reset & Base ===== */
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-padding-top: 150px; }
.skip-link { position: fixed; top: -100%; left: 8px; z-index: 9999; padding: 8px 16px; background: var(--primary); color: #fff; font-size: 13px; font-weight: 700; border-radius: 0 0 6px 6px; transition: top 0.2s; text-decoration: none; }
.skip-link:focus { top: 0; outline: 2px solid var(--accent); outline-offset: 2px; }
body {
  font-family: var(--font-body); font-weight: 300; font-size: 16px;
  color: var(--text-main); background: var(--surface); -webkit-font-smoothing: antialiased;
}
a { color: var(--text); text-decoration: none; }
img, svg { max-width: 100%; height: auto; vertical-align: middle; }
svg.svg-inline--fa { height: 1em; width: 1em; }

/* ===== Notifications ===== */
#notification-container { position: fixed; top: 100px; right: 20px; z-index: 9999; display: flex; flex-direction: column; gap: 8px; }
.notification { padding: 12px 20px; border-radius: 8px; color: #fff; font-size: 13px; font-family: var(--font-sub); font-weight: 600; box-shadow: 0 4px 12px rgba(0,0,0,0.15); animation: slideIn 0.3s ease; max-width: 360px; }
.notification-info { background: var(--primary); }
.notification-success { background: #16a34a; }
.notification-error { background: #dc2626; }
.notification-fade { opacity: 0; transform: translateX(20px); transition: all 0.3s; }
@keyframes slideIn { from { opacity: 0; transform: translateX(20px); } to { opacity: 1; transform: translateX(0); } }

/* ===== HEADER ===== */
header {
  position: fixed; top: 0; left: 0; right: 0; width: 100%; z-index: 900;
  background: #ffffff;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
  transition: all 0.5s;
}
header.small { border-bottom: 3px solid var(--accent); }
header.small .header-top { height: 0; overflow: hidden; padding: 0; }

.header-top {
  background: var(--primary); padding: 6px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.12); transition: all 0.3s; overflow: visible;
}
.header-top-inner {
  max-width: 1400px; margin: 0 auto; padding: 0 30px;
  display: flex; justify-content: flex-end; align-items: center; gap: 12px;
}
.header-top a { color: rgba(255,255,255,0.9); font-size: 12px; font-family: var(--font-body); font-weight: 500; letter-spacing: 0.2px; transition: color 0.2s; }
.header-top a:hover { color: #fff; text-decoration: none; }

/* Link desabilitado (coming-soon) - APENAS classe .disabled, NAO a[href="#"] */
.disabled{cursor:not-allowed;text-decoration:none;pointer-events:none;opacity:.6;font-style:italic}
.header-top a.disabled,.header-top a[href="#"]{color:rgba(255,255,255,0.35)!important}
.mega-menu-col a.disabled,.mega-menu-col a[href="#"]{color:rgba(255,255,255,0.35)!important}
.mega-menu-item a.disabled,.mega-menu-item a[href="#"]{color:rgba(255,255,255,0.35)!important;position:relative}
.mega-menu-item a.disabled:hover::after,.mega-menu-item a[href="#"]:hover::after{content:"Em desenvolvimento";position:absolute;bottom:-2px;left:0;font-size:9px;color:rgba(255,255,255,.5);font-style:normal;white-space:nowrap}

.header-top .sep { color: rgba(255,255,255,0.25); }
.header-top .top-link { border-right: 1px solid rgba(255,255,255,0.18); padding-right: 10px; display: inline-flex; align-items: center; }
.header-top .top-link:last-child { border: none; padding-right: 0; }
.header-top .nav-user-label { color: #ffffff; font-weight: 600; }

/* Botao Executivo Admin Nivel 4+ no Header Superior */
.header-top #nav-admin-link a,
.header-admin-btn {
  background: rgba(251, 191, 36, 0.16);
  border: 1px solid rgba(251, 191, 36, 0.45);
  color: #fbbf24 !important;
  font-weight: 700 !important;
  font-size: 11.5px;
  padding: 2px 8px;
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  transition: all 0.2s ease;
  letter-spacing: 0.3px;
}
.header-top #nav-admin-link a:hover,
.header-admin-btn:hover {
  background: #fbbf24;
  color: #0f172a !important;
  border-color: #fbbf24;
  box-shadow: 0 0 10px rgba(251, 191, 36, 0.4);
  text-decoration: none;
}
.header-top #nav-admin-link a i,
.header-admin-btn i {
  font-size: 11px;
}

/* Botao Inicio / Home Casinha */
.header-top-home {
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 5px;
  background: rgba(255, 255, 255, 0.12); border: 1px solid rgba(255, 255, 255, 0.25);
  color: #ffffff !important; font-size: 12px; transition: all 0.2s ease; margin-left: 2px;
}
.header-top-home:hover {
  background: rgba(255, 255, 255, 0.25); border-color: #ffffff;
  transform: scale(1.06); color: #ffffff !important;
}

/* Barra de Pesquisa Minimalista no Header Top */
.search-box {
  position: relative; display: inline-flex; align-items: center; margin: 0 4px;
}
#searchInput {
  background: rgba(255, 255, 255, 0.12); border: 1px solid rgba(255, 255, 255, 0.22);
  color: #ffffff; border-radius: 4px; padding: 4px 26px 4px 10px;
  font-size: 11.5px; font-family: var(--font-body); width: 150px; transition: all 0.25s ease;
}
#searchInput:focus {
  background: rgba(255, 255, 255, 0.2); border-color: #ffffff;
  width: 200px; outline: none; box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.2);
}
#searchInput::placeholder { color: rgba(255, 255, 255, 0.65); }
.header-search-btn {
  position: absolute; right: 4px; background: transparent; border: none;
  color: rgba(255, 255, 255, 0.75); cursor: pointer; font-size: 11px; padding: 4px;
  display: flex; align-items: center; justify-content: center;
}
.header-search-btn:hover { color: #ffffff; }
.header-search-dropdown {
  position: absolute; top: calc(100% + 6px); right: 0; width: 280px;
  background: #0f172a; border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 6px; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  z-index: 1000; overflow: hidden; font-family: var(--font-body);
}
.header-search-list {
  display: flex; flex-direction: column; max-height: 280px; overflow-y: auto;
}
.header-search-item {
  display: flex; align-items: center; gap: 10px; padding: 8px 12px;
  color: #f8fafc !important; text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05); transition: background 0.15s;
}
.header-search-item:hover {
  background: #1e293b; color: #38bdf8 !important;
}
.header-search-item i {
  font-size: 14px; color: #38bdf8; width: 18px; text-align: center;
}
.header-search-item strong {
  display: block; font-size: 12px; color: #ffffff;
}
.header-search-item span {
  display: block; font-size: 10px; color: #94a3b8;
}
.header-search-empty {
  padding: 12px; text-align: center; color: #94a3b8; font-size: 11px;
}

.header-main {
  background: #fff; padding: 16px 30px;
  max-width: 1400px; margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between;
}

/* Logo */
.logo {
  display: flex; align-items: center; gap: 12px;
  font-family: var(--font-head); text-transform: uppercase;
}
.logo-icon {
  width: 44px; height: 44px;
  background: linear-gradient(135deg, var(--primary), var(--primary-dark));
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; font-weight: 700; color: #fff;
  letter-spacing: 1px;
}
.logo-text { font-size: 26px; font-weight: 500; color: var(--primary); letter-spacing: 2px; }
.logo-text span { color: var(--accent); }
.logo-sub { font-size: 10px; color: var(--text-light); letter-spacing: 4px; font-weight: 400; margin-top: -2px; text-transform: uppercase; }

/* Navigation */
#menu { display: flex; align-items: center; }
.menu-toggle { display: none; font-size: 26px; cursor: pointer; color: var(--primary); }
.nav-list { display: flex; list-style: none; }
.nav-list > li { position: relative; }
.nav-list > li > a {
  display: block; padding: 8px 14px;
  font-family: var(--font-sub); font-size: 12px; font-weight: 700;
  text-transform: uppercase; color: var(--text);
  letter-spacing: 0.5px; transition: all 0.3s; border-radius: 4px;
}
.nav-list > li > a:hover, .nav-list > li > a.active {
  background: var(--primary); color: #fff; text-decoration: none;
}

/* ===== SECTION COLORS ===== */
:root {
  --color-projeto: #1a4a9f;
  --color-geral: #0d7377;
  --color-fabrica: #c0392b;
  --color-tambores: #b8860b;
}

/* Section Color Accents */
.section-projeto { --section-accent: var(--color-projeto); }
.section-geral { --section-accent: var(--color-geral); }
.section-fabrica { --section-accent: var(--color-fabrica); }
.section-tambores { --section-accent: var(--color-tambores); }

/* ===== MEGA MENU V2 ===== */
.mega-menu {
  position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
  min-width: 520px;
  display: none; padding: 16px; z-index: 100;
  border-radius: 0 0 10px 10px; box-shadow: 0 12px 32px rgba(0,0,0,0.2);
  background: #fff; border: 1px solid var(--border);
}
.mega-menu.open { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }

/* Section-specific colors */
.mega-projeto { border-top: 3px solid var(--color-projeto); }
.mega-geral { border-top: 3px solid var(--color-geral); }
.mega-fabrica { border-top: 3px solid var(--color-fabrica); }
.mega-tambores { border-top: 3px solid var(--color-tambores); }

/* Mega Menu Items */
.mega-menu-item {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 10px 12px; border-radius: 6px; transition: background 0.2s;
}
.mega-menu-item:hover { background: var(--bg-grey); }
.mega-menu-item-featured {
  background: var(--bg-grey); border: 1px solid var(--accent);
}
.mega-menu-item-featured:hover { background: var(--bg-grey-alt); }

.mega-icon {
  width: 34px; height: 34px; min-width: 34px;
  background: var(--bg-grey-alt); border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; color: var(--primary);
  margin-top: 2px;
}
.mega-projeto .mega-icon { color: var(--color-projeto); }
.mega-geral .mega-icon { color: var(--color-geral); }
.mega-fabrica .mega-icon { color: var(--color-fabrica); }
.mega-tambores .mega-icon { color: var(--color-tambores); }

.mega-menu-item strong {
  display: block; font-family: var(--font-sub); font-size: 12px;
  color: var(--text); margin-bottom: 2px; letter-spacing: 0.3px;
}
.mega-menu-item a {
  display: block; font-size: 11px; color: var(--text-muted);
  padding: 1px 0; font-family: var(--font-body); transition: color 0.2s;
}
.mega-menu-item a:hover { color: var(--primary); }
.mega-menu-item a.disabled,
.mega-menu-item a[href="#"] {
  color: var(--text-light) !important;
  font-style: italic;
  cursor: not-allowed;
  opacity: 0.55;
}

/* Nav Section Indicators */
.nav-indicator {
  display: inline-block; width: 6px; height: 6px; border-radius: 50%;
  margin-right: 4px; vertical-align: middle;
}
.nav-indicator.projeto { background: var(--color-projeto); }
.nav-indicator.geral { background: var(--color-geral); }
.nav-indicator.fabrica { background: var(--color-fabrica); }
.nav-indicator.tambores { background: var(--color-tambores); }

/* Mobile login (hidden on desktop) */
.nav-login-mobile { display: none; }

/* Badge New */
.badge-new { background: #16a34a; color: #fff; padding: 2px 8px; border-radius: 4px; font-size: 10px; font-weight: 700; }

/* History Panel */
.history-panel { display: none; margin-top: 8px; max-height: 300px; overflow-y: auto; border: 1px solid var(--border); border-radius: 6px; padding: 10px; background: #fff; }
.history-panel.open { display: block; }

/* Unit Toggle */
#unit-toggle {
  cursor: pointer; padding: 2px 10px; border: 1px solid rgba(255,255,255,0.3);
  border-radius: 4px; font-size: 11px; color: rgba(255,255,255,0.85);
  font-family: var(--font-sub); transition: all 0.3s; margin-left: 8px;
  white-space: nowrap; user-select: none;
}
#unit-toggle:hover { border-color: #fff; color: #fff; }

/* Lang Flags */
.lang-flags {
  display: inline-flex; align-items: center; gap: 4px;
  margin-left: 10px; padding: 3px 4px;
  background: rgba(255,255,255,0.08);
  border-radius: 5px;
}
.lang-flag {
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer; font-size: 11px; font-weight: 700; line-height: 1;
  font-family: var(--font-sub, 'Fira Sans', sans-serif);
  padding: 2px 6px; opacity: 0.45;
  transition: opacity 0.2s, transform 0.15s, background 0.2s;
  user-select: none; border-radius: 3px; letter-spacing: 0.5px;
}
.lang-flag:hover { opacity: 0.85; background: rgba(255,255,255,0.12); transform: scale(1.08); }
.lang-flag.active { opacity: 1; background: rgba(255,255,255,0.18); box-shadow: 0 0 0 1px rgba(255,255,255,0.3); }
.lang-pt { color: #009c3b; border: 1px solid rgba(0,156,59,0.4); }
.lang-en { color: #b31942; border: 1px solid rgba(179,25,66,0.4); }
.lang-es { color: #006847; border: 1px solid rgba(0,104,71,0.4); }

/* Mega Menu Collapsible */
.mega-menu-toggle { grid-column: 1 / -1; text-align: center; padding: 6px 0; }
.mega-toggle-btn { font-size: 11px; color: var(--accent); cursor: pointer; text-decoration: none; }
.mega-toggle-btn:hover { text-decoration: underline; }
.mega-menu-collapsed { display: contents; }
.mega-menu-collapsed > .mega-menu-item { display: flex; }

/* Touch Device Mega Menu - disable hover */
.touch-device .mega-menu { display: none; }
.touch-device .mega-menu.open { display: flex; }

/* Mobile Mega Menu */
@media (max-width: 767px) {
  .mega-menu { position: static; background: transparent; min-width: auto; padding: 0; box-shadow: none; border: none; }
  .mega-menu.open { display: block; padding: 4px 0 8px 0; }
  .mega-menu-item { padding: 6px 8px; gap: 8px; }
  .mega-menu-item strong { font-size: 11px; }
  .mega-menu-item a { font-size: 11px; color: var(--text); padding: 2px 0; }
  .mega-icon { width: 28px; height: 28px; min-width: 28px; font-size: 12px; }
  .mega-menu-item-featured { background: transparent; border: none; }
  .mega-menu-toggle { display: block; text-align: left; padding: 4px 8px; }
  .mega-menu-toggle ~ .mega-menu-toggle { display: none; }
  .mega-menu-collapsed > .mega-menu-item { display: block; }
  .nav-list > li > a { padding: 10px 12px; font-size: 12px; }
  .nav-login-mobile { display: block; }
  .nav-login-mobile a { color: var(--accent) !important; font-weight: 700; }
  .lang-flags { margin-left: 0; }
  .lang-flag { font-size: 12px; padding: 3px 7px; }
}

/* ===== HERO ===== */
#hero {
  margin-top: var(--header-h);
  min-height: 420px; position: relative; overflow: hidden;
  background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary) 60%, var(--primary-light) 100%);
  border-bottom: 4px solid var(--accent);
  display: flex; align-items: center;
}
.hero-content {
  max-width: 1400px; margin: 0 auto; padding: 60px 30px;
  text-align: center;
}
.hero-badge {
  display: inline-block;
  background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.2);
  color: #fff; padding: 6px 20px; border-radius: 20px;
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 1.5px; margin-bottom: 20px;
}
.hero-text h1 {
  font-family: var(--font-head); font-size: 52px; font-weight: 400;
  color: #fff; line-height: 1.2; margin-bottom: 16px;
}
.hero-text h1 span { color: var(--accent); }
.hero-text p {
  color: rgba(255,255,255,0.75); font-size: 17px;
  max-width: 640px; line-height: 1.6; margin: 0 auto 28px;
}
.hero-btn {
  display: inline-block;
  background: var(--accent); color: #fff;
  font-family: var(--font-head); font-size: 15px; text-transform: uppercase;
  padding: 12px 36px; border-radius: 6px; font-weight: 400; letter-spacing: 1.5px;
  transition: all 0.3s;
}
.hero-btn:hover { background: #2563eb; color: #fff; text-decoration: none; }
.hero-stats {
  display: flex; justify-content: center; gap: 40px; margin-top: 40px;
}
.hero-stat { text-align: center; }
.hero-stat .num {
  font-family: var(--font-head); font-size: 20px; font-weight: 500;
  color: var(--accent);
}
.hero-stat .label { font-size: 11px; color: rgba(255,255,255,0.6); text-transform: uppercase; letter-spacing: 1.5px; }

/* ===== SECTIONS ===== */
.section { padding: 70px 30px; max-width: 1200px; margin: 0 auto; }
.section-wide { max-width: 100%; padding: 70px 30px; }
.section-title {
  font-family: var(--font-head); font-size: 38px; font-weight: 400;
  color: var(--primary); text-align: center; margin-bottom: 8px;
}
.section-sub {
  text-align: center; color: var(--text-muted); font-size: 15px; margin-bottom: 44px;
}
.section-grey { background: var(--bg-grey); }

/* ===== FA FALLBACK: renders ? for missing icon classes ===== */
i[class*="fa-"].fa-null:before,
svg.svg-inline--fa.fa-null {
  content: "\f059"; /* fa-question-circle */
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  color: var(--text-light);
}

/* ===== TOOLS GRID ===== */
.tools-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 20px;
}
.tool-card {
  background: #fff; border: 1px solid var(--border); border-radius: 10px;
  padding: 28px 24px; text-align: center; transition: all 0.3s;
  cursor: pointer; position: relative;
}
.tool-card:hover {
  box-shadow: 0 8px 25px rgba(6,47,135,0.1);
  border-color: var(--primary); transform: translateY(-2px);
}
.tool-card .icon {
  width: 60px; height: 60px; margin: 0 auto 14px;
  background: var(--bg-grey); border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  font-size: 26px; color: var(--primary); transition: all 0.3s;
}
.tool-card .icon i, .tool-card .icon svg.svg-inline--fa {
  font-size: 26px; color: inherit; width: 26px; height: 26px;
}
.tool-card:hover .icon { background: var(--primary); color: #fff; }
.tool-card h3 { font-family: var(--font-head); font-size: 18px; font-weight: 400; margin-bottom: 6px; }
.tool-card p { font-size: 12px; color: var(--text-muted); line-height: 1.5; }
.tool-card.hidden { display: none; }
.tool-card .badge {
  display: inline-block; margin-top: 10px;
  background: rgba(59,130,246,0.1); color: var(--accent);
  font-size: 9px; font-weight: 700; text-transform: uppercase;
  padding: 3px 10px; border-radius: 8px; letter-spacing: 0.5px;
}
.badge { display:inline-block; padding:3px 10px; border-radius:12px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.5px; margin-right:8px; }
.badge-ok { background:#dcfce7; color:#166534; }
.badge-fail { background:#fef2f2; color:#991b1b; border:1px solid #fca5a5; }
.tool-card.locked { opacity: 0.55; }
.tool-card.locked .icon { color: var(--text-light); background: var(--bg-grey-alt); }
.tool-card .lock-badge {
  position: absolute; top: 10px; right: 10px;
  color: var(--text-light); font-size: 14px;
}

/* Search */
.search-box { position: relative; display: inline-flex; align-items: center; }
.search-box input {
  background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.3);
  border-radius: 18px; padding: 5px 32px 5px 12px; width: 170px;
  color: #fff; font-size: 12px; font-family: var(--font-sub);
  outline: none; transition: all 0.3s;
}
.search-box input::placeholder { color: rgba(255,255,255,0.65); }
.search-box input:focus { width: 250px; background: rgba(255,255,255,0.22); border-color: rgba(255,255,255,0.6); }
.search-box .header-search-btn {
  position: absolute; right: 3px; top: 50%; transform: translateY(-50%);
  background: var(--accent, #0d9488); border: none; border-radius: 50%;
  width: 22px; height: 22px; display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 10px; cursor: pointer; transition: all 0.2s ease;
  padding: 0;
}
.search-box .header-search-btn:hover {
  background: #0f766e; transform: translateY(-50%) scale(1.1);
  box-shadow: 0 0 8px rgba(13, 148, 136, 0.5);
}

/* Live Search Dropdown no Header */
.header-search-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: 380px;
  max-width: 90vw;
  background: #ffffff;
  border-radius: 8px;
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.25), 0 8px 10px -6px rgba(0, 0, 0, 0.2);
  border: 1px solid #cbd5e1;
  z-index: 9999;
  overflow: hidden;
  text-align: left;
}
.header-search-header {
  padding: 8px 12px;
  background: #001233;
  color: #94a3b8;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.header-search-results-list {
  max-height: 320px;
  overflow-y: auto;
}
.header-search-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  border-bottom: 1px solid #f1f5f9;
  text-decoration: none;
  color: #0f172a;
  transition: background 0.15s ease;
}
.header-search-item:hover {
  background: #f8fafc;
}
.header-search-item-icon {
  width: 30px;
  height: 30px;
  border-radius: 6px;
  background: #e2e8f0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #001233;
  font-size: 13px;
  flex-shrink: 0;
}
.header-search-item-content {
  flex: 1;
  min-width: 0;
}
.header-search-item-title {
  font-size: 13px;
  font-weight: 700;
  color: #001233;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.header-search-item-sub {
  font-size: 11px;
  color: #64748b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.header-search-item-badge {
  font-size: 9px;
  font-weight: 700;
  padding: 2px 6px;
  border-radius: 999px;
  text-transform: uppercase;
}
.header-search-item-badge.lvl-5 { background: rgba(239, 68, 68, 0.15); color: #b91c1c; border: 1px solid #ef4444; }
.header-search-item-badge.lvl-4 { background: rgba(2, 132, 199, 0.12); color: #0369a1; border: 1px solid #0284c7; }
.header-search-item-badge.lvl-3 { background: rgba(16, 185, 129, 0.12); color: #047857; border: 1px solid #10b981; }
.header-search-item-badge.lvl-2 { background: rgba(59, 130, 246, 0.12); color: #1d4ed8; border: 1px solid #3b82f6; }
.header-search-item-badge.lvl-1 { background: rgba(100, 116, 139, 0.12); color: #475569; border: 1px solid #94a3b8; }
.header-search-footer {
  padding: 8px 12px;
  background: #f8fafc;
  border-top: 1px solid #e2e8f0;
  text-align: center;
}
.header-search-footer a {
  font-size: 12px;
  font-weight: 700;
  color: #0d9488;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.header-search-footer a:hover {
  color: #0f766e;
  text-decoration: underline;
}

/* Badges e Atalhos de Usuario no Topo */
.header-user-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.12);
  color: #f8fafc;
  border: 1px solid rgba(255, 255, 255, 0.25);
  margin-right: 6px;
}
.header-quicklink-rnc {
  background: linear-gradient(135deg, #ef4444, #b91c1c) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  padding: 2px 8px !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  box-shadow: 0 0 8px rgba(239, 68, 68, 0.4);
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-right: 6px;
}
.header-quicklink-telemetry {
  background: rgba(2, 132, 199, 0.25) !important;
  color: #38bdf8 !important;
  font-weight: 600 !important;
  padding: 2px 8px !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  border: 1px solid rgba(56, 189, 248, 0.4) !important;
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-right: 6px;
}
.header-quicklink-tool {
  color: rgba(255, 255, 255, 0.85) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-right: 6px;
}
.header-quicklink-tool:hover {
  color: #ffffff !important;
  text-decoration: underline !important;
}

/* Featured tool */
.featured-tool {
  background: linear-gradient(135deg, var(--primary), var(--primary-dark));
  border-radius: 14px; padding: 44px; color: #fff;
  display: flex; align-items: center; gap: 36px; margin-top: 28px;
}
.featured-tool-text { flex: 1; }
.featured-tool-text h3 { font-family: var(--font-head); font-size: 26px; font-weight: 400; margin-bottom: 8px; }
.featured-tool-text h3 span { color: var(--accent); }
.featured-tool-text p { color: rgba(255,255,255,0.75); font-size: 13px; line-height: 1.6; }
.featured-tool-btn {
  display: inline-block; margin-top: 14px;
  background: var(--accent); color: #fff;
  font-family: var(--font-head); font-size: 14px; text-transform: uppercase;
  padding: 10px 30px; border-radius: 6px; letter-spacing: 1px;
  transition: all 0.3s;
}
.featured-tool-btn:hover { background: #2563eb; color: #fff; text-decoration: none; }

/* ===== BLOG ===== */
.blog-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px;
}
.blog-card {
  background: #fff; border: 1px solid var(--border); border-radius: 10px; overflow: hidden;
  transition: all 0.3s;
}
.blog-card:hover { box-shadow: 0 4px 20px rgba(6,47,135,0.08); }
.blog-card-img { height: 160px; background: var(--bg-grey); display: flex; align-items: center; justify-content: center; }
.blog-card-body { padding: 18px; }
.blog-card-body .tag {
  display: inline-block; background: rgba(6,47,135,0.06); color: var(--primary);
  font-size: 9px; font-weight: 700; text-transform: uppercase;
  padding: 2px 8px; border-radius: 6px; margin-bottom: 6px; letter-spacing: 0.5px;
}
.blog-card-body h4 { font-family: var(--font-head); font-size: 17px; font-weight: 400; margin-bottom: 4px; }
.blog-card-body p { font-size: 12px; color: var(--text-muted); line-height: 1.5; }
.blog-card-body .blog-readmore { font-size: 12px; color: var(--accent); font-weight: 600; display: inline-block; margin-top: 8px; }
.blog-card-body .blog-readmore:hover { text-decoration: underline; }

/* ===== FOOTER ===== */
footer {
  background: var(--primary-dark); color: #fff; padding: 44px 30px 24px;
}
.footer-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 36px; }
footer h5 { font-family: var(--font-head); font-size: 14px; font-weight: 400; color: var(--accent); text-transform: uppercase; margin-bottom: 12px; letter-spacing: 1px; }
footer a { color: rgba(255,255,255,0.65); font-size: 12px; display: block; margin-bottom: 5px; transition: color 0.3s; }
footer a:hover { color: #fff; text-decoration: none; }
.footer-drawer-links {
  margin-top: 2px;
  animation: fadeIn 0.2s ease-in-out;
}
.footer-drawer-toggle {
  background: rgba(255, 255, 255, 0.08);
  color: var(--accent, #38bdf8);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 4px;
  font-size: 10px;
  font-weight: 600;
  padding: 3px 8px;
  cursor: pointer;
  margin-top: 6px;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  transition: all 0.2s ease;
}
.footer-drawer-toggle:hover {
  background: var(--accent, #38bdf8);
  color: #0f172a;
  border-color: var(--accent, #38bdf8);
}
footer p { color: rgba(255,255,255,0.55); font-size: 12px; line-height: 1.6; }
.footer-logo { font-family: var(--font-head); font-size: 22px; color: #fff; margin-bottom: 8px; }
.footer-logo span { color: var(--accent); }
.footer-social { display: flex; gap: 8px; margin-top: 12px; }
.footer-social a {
  width: 32px; height: 32px; border: 1px solid rgba(255,255,255,0.15);
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,0.7); font-size: 14px; margin: 0; transition: all 0.3s;
}
.footer-social a:hover { background: var(--accent); border-color: var(--accent); color: #fff; }
.footer-bottom {
  max-width: 1200px; margin: 24px auto 0; padding-top: 16px;
  border-top: 1px solid rgba(255,255,255,0.08);
  font-size: 11px; color: rgba(255,255,255,0.35);
  display: flex; justify-content: space-between;
}
.footer-bottom a { color: rgba(255,255,255,0.45); display: inline; font-size: 11px; transition: color 0.3s; }
.footer-bottom a:hover { color: #fff; }

/* Back to top */
.back-top {
  position: fixed; bottom: 24px; right: 24px;
  width: 40px; height: 40px; background: var(--primary);
  color: #fff; border: none; border-radius: 8px;
  font-size: 16px; cursor: pointer; display: none; z-index: 100;
  box-shadow: 0 2px 10px rgba(0,0,0,0.15); transition: background 0.3s;
}
.back-top.show { display: block; }
.back-top:hover { background: var(--primary-light); }

/* ===== ABOUT & CONTACT ===== */
.contato-section {
  padding: 70px 30px;
  max-width: 1200px;
  margin: 0 auto;
}
.contato-grid {
  max-width: 800px; margin: 0 auto;
  display: grid; grid-template-columns: 1fr 1fr; gap: 24px;
}
.contato-card {
  background: #fff; border: 1px solid var(--border); border-radius: 10px;
  padding: 28px 24px; transition: all 0.3s;
}
.contato-card:hover { box-shadow: 0 4px 20px rgba(6,47,135,0.06); }
.contato-card .c-icon {
  width: 44px; height: 44px; border-radius: 10px;
  background: var(--bg-grey); display: flex; align-items: center; justify-content: center;
  font-size: 18px; color: var(--primary); margin-bottom: 12px;
}
.contato-card h4 { font-family: var(--font-head); font-size: 16px; font-weight: 400; color: var(--primary); margin-bottom: 4px; }
.contato-card p { font-size: 13px; color: var(--text-muted); line-height: 1.6; margin-bottom: 4px; }
.contato-card a { color: var(--accent); font-size: 13px; transition: text-decoration 0.3s; }
.contato-card a:hover { text-decoration: underline; }
.contato-full {
  grid-column: 1 / -1;
}
.contato-back {
  text-align: center; margin-top: 32px;
}
.contato-back a { color: var(--primary); font-family: var(--font-sub); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; transition: color 0.3s; }
.contato-back a:hover { color: var(--accent); text-decoration: none; }

.sobre-section {
  padding: 70px 30px;
  max-width: 1200px;
  margin: 0 auto;
}
.sobre-content {
  max-width: 800px; margin: 0 auto;
}
.sobre-text {
  font-size: 15px; color: var(--text); line-height: 1.8;
}
.sobre-text p { margin-bottom: 18px; }
.sobre-highlight {
  background: var(--bg-grey); border-left: 4px solid var(--accent);
  padding: 24px; border-radius: 0 10px 10px 0; margin: 24px 0;
  font-size: 14px; line-height: 1.7; color: var(--text-muted);
}
.sobre-back {
  text-align: center; margin-top: 36px;
}
.sobre-back a { color: var(--primary); font-family: var(--font-sub); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; transition: color 0.3s; }
.sobre-back a:hover { color: var(--accent); text-decoration: none; }

/* ===== CALCULATOR LAYOUT ===== */
.calc-page { background: var(--bg-grey); min-height: 100vh; }
.calc-wrapper { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
.calc-header { padding-top: 150px; padding-bottom: 24px; }
.calc-header h1 { font-family: var(--font-head); font-size: 32px; font-weight: 400; color: var(--primary); margin: 0; }
.calc-header p { font-size: 13px; color: var(--text-muted); margin-top: 4px; }
.calc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; padding-bottom: 40px; }
.calc-card { background: #fff; border: 1px solid var(--border); border-radius: 12px; padding: 24px; }
.calc-card h2 { font-family: var(--font-head); font-size: 22px; font-weight: 400; color: var(--primary); margin: 0 0 16px; padding-bottom: 8px; border-bottom: 1px solid var(--border); }
.calc-section-title { font-family: var(--font-sub); font-size: 13px; font-weight: 700; color: var(--primary); margin: 20px 0 8px; padding-left: 8px; border-left: 3px solid var(--primary); }
.calc-field { margin-bottom: 12px; }
.calc-field label { display: block; font-family: var(--font-sub); font-size: 10px; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 4px; }
.calc-field input, .calc-field select {
  width: 100%; padding: 10px 12px; border: 1px solid var(--border); border-radius: 6px;
  font-family: 'Courier New', monospace; font-size: 13px; color: var(--text);
  background: #fff; outline: none; transition: border-color 0.3s, box-shadow 0.3s;
  box-sizing: border-box;
}
.calc-field input:focus, .calc-field select:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(6,47,135,0.1); }
.calc-field input:read-only { background: var(--bg-grey); color: var(--text-muted); cursor: default; }
.calc-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.calc-btn {
  width: 100%; margin-top: 20px; padding: 12px 24px; border: 2px solid var(--primary); border-radius: 6px;
  background: var(--primary); color: #fff;
  font-family: var(--font-sub); font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px;
  cursor: pointer; transition: all 0.3s; box-shadow: 0 4px 14px rgba(6,47,135,0.3);
}
.calc-btn:hover { background: var(--primary-dark); transform: translateY(-1px); box-shadow: 0 6px 20px rgba(6,47,135,0.4); }

/* ===== LOCKED TOOL CARDS ===== */
.tool-card { position: relative; overflow: hidden; }
.tool-card .tool-preview { position: absolute; bottom: 0; left: 0; right: 0; height: 0; overflow: hidden; background: rgba(255,255,255,0.95); transition: height 0.3s ease; border-top: 1px solid var(--border); padding: 0 8px; display: flex; align-items: center; }
.tool-card:hover .tool-preview { height: 50px; padding: 4px 8px; }
.tool-card.locked { cursor: pointer; }
.tool-card.locked:hover .lock-desc { opacity: 1; }
.lock-badge { z-index: 2; position: relative; }
.lock-desc { font-size: 10px; color: var(--text-light); margin-top: 6px; opacity: 0.7; transition: opacity 0.3s; }
.progress-bar { height: 3px; background: var(--bg-grey-alt); border-radius: 2px; margin-top: 8px; overflow: hidden; }
.progress-fill { height: 100%; background: linear-gradient(90deg, var(--accent), var(--primary)); border-radius: 2px; transition: width 0.5s; }

.calc-alerts { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
.calc-alert { padding: 10px 16px; border-radius: 6px; font-family: var(--font-sub); font-size: 12px; font-weight: 700; border-left: 4px solid; }
.calc-alert-danger { background: rgba(255,103,0,0.1); border-left-color: #FF6700; color: #FF6700; border: 1px solid rgba(255,103,0,0.2); border-left-width: 4px; }
.calc-alert-warning { background: rgba(6,47,135,0.08); border-left-color: var(--primary); color: var(--primary); border: 1px solid rgba(6,47,135,0.2); border-left-width: 4px; }
.calc-alert-success { background: rgba(74,222,128,0.1); border-left-color: #4ade80; color: #4ade80; border: 1px solid rgba(74,222,128,0.2); border-left-width: 4px; }
.calc-alert-info { background: rgba(59,130,246,0.1); border-left-color: var(--accent); color: var(--accent); border: 1px solid rgba(59,130,246,0.2); border-left-width: 4px; }
.calc-placeholder { color: var(--text-muted); font-size: 13px; text-align: center; padding: 40px 0; }
.calc-status-bar { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 16px; background: var(--bg-grey); border: 1px solid var(--border); border-radius: 6px; font-size: 13px; margin-bottom: 12px; }
.calc-result-table { width: 100%; border-collapse: collapse; margin-top: 16px; font-family: 'Courier New', monospace; font-size: 13px; }
.calc-result-table th { padding: 8px 12px; text-align: left; font-family: var(--font-sub); font-weight: 700; border: 1px solid var(--border); background: var(--bg-grey); color: var(--primary); }
.calc-result-table td { padding: 8px 12px; border: 1px solid var(--border); color: var(--text); }
.calc-result-table td:last-child { text-align: right; color: var(--text-muted); }

.btn-primary,.btn-secondary{display:inline-flex;align-items:center;gap:6px;padding:10px 20px;border:none;border-radius:6px;font-family:var(--font-sub);font-size:13px;font-weight:700;cursor:pointer;transition:all .2s}
.btn-primary{background:var(--primary);color:#fff}
.btn-primary:hover{background:var(--primary-dark)}
.btn-secondary{background:var(--bg-grey);color:var(--text);border:1px solid var(--border)}
.btn-secondary:hover{background:var(--bg-grey-alt)}

.tool-wrapper{max-width:1280px;margin:0 auto;padding:140px 20px 40px}
.tool-header{margin-bottom:30px}
.tool-header h1{font-family:var(--font-head);font-size:32px;font-weight:400;color:var(--primary);margin:0}
.tool-subtitle{color:var(--text-muted);font-size:14px;margin:10px 0 0;max-width:600px}
.tool-grid{display:grid;grid-template-columns:1fr 360px;gap:24px;align-items:start}
.tool-form,.tool-results,.tool-sidebar .card{padding:24px}
.tool-form h3,.tool-results h3,.tool-sidebar h4{font-family:var(--font-head);font-size:20px;font-weight:400;color:var(--primary);margin:0 0 16px;display:flex;align-items:center;gap:8px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.form-row .input-group.half{margin-bottom:0}
.form-actions{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}

.result-table{width:100%;border-collapse:collapse;margin-top:12px;font-size:13px}
.result-table th{padding:8px 10px;text-align:left;font-weight:700;background:var(--bg-grey);border:1px solid var(--border);color:var(--primary);font-size:11px;text-transform:uppercase;letter-spacing:.5px}
.result-table td{padding:8px 10px;border:1px solid var(--border);color:var(--text)}
.result-table td:last-child{text-align:right;font-weight:700;color:var(--primary)}

.kpi-bar{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:8px;margin-bottom:16px}
.kpi-item{text-align:center;padding:12px 8px;background:var(--bg-grey);border-radius:6px;border:1px solid var(--border)}
.kpi-label{display:block;font-size:9px;text-transform:uppercase;letter-spacing:1px;color:var(--text-light);font-weight:700}
.kpi-value{display:block;font-size:22px;font-weight:700;color:var(--primary);font-family:var(--font-head)}
.kpi-unit{display:block;font-size:10px;color:var(--text-muted)}

.derivation{margin-top:16px}
.derivation summary{font-weight:700;color:var(--primary);cursor:pointer;padding:8px 0;font-size:13px}
.deriv-step{padding:6px 10px;margin:2px 0;border-radius:4px;background:var(--bg-grey);font-size:12px;border-left:3px solid var(--accent)}
.deriv-step strong{color:var(--primary)}

.calc-alert-otimo{background:rgba(74,222,128,0.1);border-left-color:#4ade80;color:#166534;border:1px solid rgba(74,222,128,0.2);border-left-width:4px}
.calc-alert-atencao{background:rgba(245,158,11,0.1);border-left-color:#f59e0b;color:#92400e;border:1px solid rgba(245,158,11,0.2);border-left-width:4px}
.calc-alert-critico{background:rgba(239,68,68,0.1);border-left-color:#ef4444;color:#991b1b;border:1px solid rgba(239,68,68,0.2);border-left-width:4px}
.calc-alert-super{background:rgba(99,102,241,0.1);border-left-color:#6366f1;color:#3730a3;border:1px solid rgba(99,102,241,0.2);border-left-width:4px}

.lewis-ref table th{background:var(--bg-grey);font-size:10px;text-transform:uppercase;letter-spacing:.5px;padding:4px 6px;border:1px solid var(--border)}
.lewis-ref table td{padding:3px 6px;border:1px solid var(--border);text-align:center;font-size:11px}

.report-page{font-family:Georgia,'Times New Roman',serif;padding:20px 30px;max-width:800px;margin:0 auto;color:#1e293b;font-size:10pt;line-height:1.5}
.report-header{border-bottom:3px solid var(--primary);padding-bottom:12px;margin-bottom:16px;text-align:center}
.report-section{margin-bottom:16px;page-break-inside:avoid}
.report-section h2{font-size:12pt;color:var(--primary);border-bottom:1px solid #e2e8f0;padding-bottom:4px;margin:0 0 8px}
.report-section table{width:100%;border-collapse:collapse;font-size:9pt}
.report-section th,.report-section td{padding:4px 8px;border:1px solid #e2e8f0;text-align:left}
.report-section th{background:#f1f5f9;font-size:8pt;text-transform:uppercase;letter-spacing:.5px}
.report-footer{border-top:1px solid #e2e8f0;padding-top:8px;margin-top:16px;font-size:8pt;color:#94a3b8;text-align:center}
.report-footer p{margin:0}
.report-ref-list{margin:0;padding-left:16px;font-size:7pt}

@media (max-width: 768px) {
  .calc-grid { grid-template-columns: 1fr; }
  .calc-grid-2 { grid-template-columns: 1fr; }
  .calc-header { padding-top: 120px; }
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
  .hero-text h1 { font-size: 40px; }
  .footer-inner { grid-template-columns: 1fr 1fr; }
  .hero-stats { gap: 24px; flex-wrap: wrap; }
}
/* ===== AUTH PAGES (login, dashboard, admin) ===== */
.login-wrapper { display: flex; justify-content: center; align-items: flex-start; padding-top: 140px; min-height: 100vh; }
.login-card { background: #fff; padding: 3rem; border-radius: 10px; border: 1px solid var(--border); box-shadow: 0 4px 24px rgba(6,47,135,0.08); width: 100%; max-width: 420px; text-align: center; margin: 20px; }
.login-card .logo-text { font-family: var(--font-head); font-size: 28px; font-weight: 500; color: var(--primary); letter-spacing: 2px; text-transform: uppercase; margin-bottom: 4px; }
.login-card .logo-text span { color: var(--accent); }
.login-card .logo-sub { font-size: 10px; color: var(--text-light); letter-spacing: 4px; font-weight: 400; text-transform: uppercase; margin-bottom: 1.5rem; }
.input-group { margin-bottom: 1.5rem; text-align: left; }
.input-group label { display: block; color: var(--text-muted); font-size: 0.8rem; margin-bottom: 0.5rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; }
.input-group input { width: 100%; padding: 14px; background: var(--bg-grey); border: 1px solid var(--border); border-radius: 6px; color: var(--text); outline: none; font-size: 1rem; font-family: var(--font-body); transition: border-color 0.3s; box-sizing: border-box; }
.input-group input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(6,47,135,0.1); }
.btn-login { width: 100%; padding: 14px; background: var(--primary); color: #fff; border: none; border-radius: 6px; font-family: var(--font-sub); font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; cursor: pointer; transition: all 0.3s; }
.btn-login:hover { background: var(--primary-dark); }
.btn-login:disabled { opacity: 0.5; cursor: not-allowed; }
.error-msg { color: #dc2626; font-size: 0.85rem; margin-top: 12px; display: none; padding: 10px; background: rgba(220,38,38,0.08); border-radius: 6px; }
.success-msg { color: #16a34a; font-size: 0.85rem; margin-top: 12px; display: none; padding: 10px; background: rgba(22,163,74,0.08); border-radius: 6px; }
.forgot-password { display: block; margin-top: 1rem; color: var(--accent); text-decoration: none; font-size: 0.85rem; cursor: pointer; }
.forgot-password:hover { text-decoration: underline; }
.loading-spinner { display: inline-block; width: 16px; height: 16px; border: 2px solid rgba(255,255,255,0.3); border-top: 2px solid #fff; border-radius: 50%; animation: spin 0.8s linear infinite; margin-right: 8px; vertical-align: middle; }
.back-link { display: block; margin-top: 1.5rem; color: var(--text-muted); text-decoration: none; font-size: 0.85rem; }
.back-link:hover { color: var(--primary); }
.modal-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.4); display: none; justify-content: center; align-items: center; z-index: 1000; }
.modal-overlay.active { display: flex; }
.modal { background: #fff; padding: 2rem; border-radius: 10px; border: 1px solid var(--border); width: 100%; max-width: 400px; margin: 20px; }
.modal h3 { font-family: var(--font-head); font-size: 20px; font-weight: 400; color: var(--primary); margin-bottom: 1rem; }
.modal-actions { display: flex; gap: 10px; margin-top: 1.5rem; }
.modal-actions button { flex: 1; padding: 12px; border-radius: 6px; cursor: pointer; font-weight: 700; transition: 0.3s; font-family: var(--font-sub); text-transform: uppercase; font-size: 12px; letter-spacing: 0.5px; }
.btn-modal-primary { background: var(--primary); color: white; border: none; }
.btn-modal-primary:hover { background: var(--primary-dark); }
.btn-modal-secondary { background: transparent; color: var(--text-muted); border: 1px solid var(--border); }
.btn-modal-secondary:hover { border-color: var(--primary); color: var(--primary); }
.btn-modal-danger { background: #dc2626; color: white; border: none; }
.btn-modal-danger:hover { background: #b91c1c; }
#dashboard-header, #admin-header { position: fixed; top: 0; left: 0; right: 0; z-index: 900; background: #fff; border-bottom: 3px solid var(--accent); height: var(--header-h); display: flex; align-items: center; }
.header-inner { max-width: 1400px; margin: 0 auto; padding: 0 30px; display: flex; align-items: center; justify-content: space-between; width: 100%; }
.logo { display: flex; align-items: center; gap: 12px; font-family: var(--font-head); text-transform: uppercase; }
.logo-icon { width: 40px; height: 40px; background: linear-gradient(135deg, var(--primary), var(--primary-dark)); border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 700; color: #fff; letter-spacing: 1px; }
.logo-text { font-size: 22px; font-weight: 500; color: var(--primary); letter-spacing: 2px; }
.logo-text span { color: var(--accent); }
.logo-sub { font-size: 9px; color: var(--text-light); letter-spacing: 4px; font-weight: 400; margin-top: -2px; text-transform: uppercase; }
.header-nav { display: flex; align-items: center; gap: 12px; }
.header-nav a { display: block; padding: 8px 14px; font-family: var(--font-sub); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; border-radius: 4px; transition: all 0.3s; }
.header-nav a:hover { background: var(--primary); color: #fff; }
.btn-sair { background: transparent; border: 1px solid var(--border); padding: 8px 14px; font-family: var(--font-sub); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; border-radius: 4px; cursor: pointer; transition: all 0.3s; color: var(--text); }
.btn-sair:hover { background: #dc2626; color: #fff; border-color: #dc2626; }
.badge-admin { background: var(--accent); color: #fff; padding: 4px 12px; border-radius: 20px; font-size: 11px; font-weight: 700; text-transform: uppercase; }
.admin-container { max-width: 1400px; margin: 0 auto; padding: 150px 30px 60px; }
.admin-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 24px; padding: 24px; background: #fff; border-radius: 10px; border: 1px solid var(--border); }
.admin-header h1 { font-family: var(--font-head); font-size: 24px; font-weight: 400; color: var(--primary); margin: 0; }
.admin-user-info { display: flex; align-items: center; gap: 12px; }
.admin-user-info span { color: var(--text-muted); font-size: 13px; }
.dashboard-container { max-width: 1200px; margin: 0 auto; padding: 150px 30px 60px; }
.welcome-header { background: linear-gradient(135deg, var(--primary), var(--primary-dark)); border-radius: 10px; padding: 32px; color: #fff; margin-bottom: 30px; }
.welcome-header h1 { font-family: var(--font-head); font-size: 28px; font-weight: 400; margin-bottom: 8px; }
.welcome-header h1 span { color: var(--accent); }
.welcome-header p { color: rgba(255,255,255,0.7); font-size: 14px; }
.user-badge { display: inline-block; padding: 4px 12px; border-radius: 20px; font-size: 11px; font-weight: 700; text-transform: uppercase; margin-left: 10px; vertical-align: middle; }
.badge-prime { background: rgba(168,85,247,0.2); color: #a855f7; border: 1px solid #a855f7; }
.badge-common { background: rgba(148,163,184,0.2); color: #94a3b8; border: 1px solid #94a3b8; }
.features-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.feature-card { background: #fff; padding: 24px; border-radius: 10px; border: 1px solid var(--border); transition: all 0.3s; }
.feature-card:hover { box-shadow: 0 4px 20px rgba(6,47,135,0.06); transform: translateY(-2px); }
.feature-card h3 { font-family: var(--font-head); font-size: 17px; font-weight: 400; color: var(--primary); margin-bottom: 8px; }
.feature-card p { color: var(--text-muted); font-size: 13px; line-height: 1.5; margin-bottom: 16px; }
.feature-card .btn-feature { display: inline-block; padding: 8px 20px; background: var(--primary); color: #fff; border-radius: 6px; font-family: var(--font-sub); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; transition: all 0.3s; }
.feature-card .btn-feature:hover { background: var(--primary-dark); }
.feature-card.locked { opacity: 0.55; }
.feature-card.locked .btn-feature { background: var(--bg-grey-alt); color: var(--text-light); cursor: not-allowed; }
.lock-icon { font-size: 1.5rem; margin-bottom: 10px; }
.security-warning { background: rgba(220,38,38,0.06); border: 1px solid rgba(220,38,38,0.2); border-radius: 8px; padding: 14px 18px; margin-bottom: 20px; display: flex; align-items: center; gap: 12px; }
.security-warning strong { color: #dc2626; font-size: 0.85rem; }
.security-warning p { color: var(--text-muted); font-size: 0.78rem; margin: 3px 0 0 0; }
.stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; margin-bottom: 30px; }
.stat-card { background: #fff; padding: 24px; border-radius: 10px; border: 1px solid var(--border); text-align: center; transition: all 0.3s; }
.stat-card:hover { box-shadow: 0 4px 20px rgba(6,47,135,0.06); }
.stat-card h3 { font-family: var(--font-head); font-size: 28px; font-weight: 500; color: var(--primary); margin-bottom: 4px; }
.stat-card p { color: var(--text-muted); font-size: 11px; text-transform: uppercase; letter-spacing: 1px; }
.tabs { display: flex; gap: 4px; margin-bottom: 20px; border-bottom: 2px solid var(--border); padding-bottom: 10px; }
.tab { padding: 10px 20px; background: transparent; border: 1px solid var(--border); color: var(--text-muted); border-radius: 6px 6px 0 0; cursor: pointer; transition: 0.3s; font-family: var(--font-sub); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; }
.tab:hover { background: rgba(6,47,135,0.05); }
.tab.active { background: var(--primary); color: #fff; border-color: var(--primary); }
.tab-content { display: none; }
.tab-content.active { display: block; }
.table-container { background: #fff; border-radius: 10px; border: 1px solid var(--border); overflow: hidden; }
.table-header { display: flex; justify-content: space-between; align-items: center; padding: 20px; border-bottom: 1px solid var(--border); }
.table-header h3 { font-family: var(--font-head); font-size: 18px; font-weight: 400; color: var(--primary); margin: 0; }
.search-box { display: flex; gap: 10px; }
.search-box input { padding: 10px 14px; background: var(--bg-grey); border: 1px solid var(--border); border-radius: 6px; color: var(--text); font-family: var(--font-body); min-width: 220px; }
.search-box input:focus { border-color: var(--primary); outline: none; }
.role-badge { display: inline-block; padding: 3px 10px; border-radius: 20px; font-size: 11px; font-weight: 700; text-transform: uppercase; }
.role-admin { background: rgba(6,47,135,0.1); color: var(--primary); border: 1px solid var(--primary); }
.role-prime { background: rgba(168,85,247,0.1); color: #a855f7; border: 1px solid #a855f7; }
.role-common { background: rgba(148,163,184,0.1); color: #94a3b8; border: 1px solid #94a3b8; }
.status-active { color: #16a34a; }
.status-inactive { color: #dc2626; }
.action-btn { background: transparent; border: 1px solid var(--border); color: var(--text); padding: 5px 10px; border-radius: 4px; cursor: pointer; margin-right: 4px; transition: 0.3s; font-family: var(--font-sub); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.3px; }
.action-btn:hover { background: rgba(6,47,135,0.05); border-color: var(--primary); }
.action-btn.danger:hover { border-color: #dc2626; }
.message { padding: 10px; border-radius: 6px; margin-bottom: 1rem; display: none; font-size: 13px; }
.message.error { background: rgba(220,38,38,0.08); border: 1px solid rgba(220,38,38,0.3); color: #dc2626; display: block; }
.message.success { background: rgba(22,163,74,0.1); border: 1px solid rgba(22,163,74,0.3); color: #16a34a; display: block; }
.loading { display: inline-block; width: 14px; height: 14px; border: 2px solid rgba(0,0,0,0.2); border-top: 2px solid var(--primary); border-radius: 50%; animation: spin 0.8s linear infinite; margin-right: 6px; vertical-align: middle; }
.empty-state { text-align: center; padding: 40px 20px; color: var(--text-muted); }
.form-group { margin-bottom: 1.2rem; }
.form-group label { display: block; color: var(--text-muted); font-size: 0.8rem; margin-bottom: 0.4rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; }
.form-group input, .form-group select { width: 100%; padding: 10px 12px; background: var(--bg-grey); border: 1px solid var(--border); border-radius: 6px; color: var(--text); font-family: var(--font-body); font-size: 0.95rem; box-sizing: border-box; }
.form-group input:focus, .form-group select:focus { border-color: var(--primary); outline: none; }
.pagination { display: flex; justify-content: space-between; align-items: center; padding: 15px; border-top: 1px solid var(--border); }
.pagination span { color: var(--text-muted); font-size: 0.85rem; }
.pagination button:disabled { opacity: 0.4; cursor: not-allowed; }

@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
@keyframes slideIn { from { opacity: 0; transform: translateX(20px); } to { opacity: 1; transform: translateX(0); } }

/* ===== BLOG ===== */
.page-hero{background:linear-gradient(135deg,#001a4d,#062F87,#1a4a9f);border-bottom:4px solid #3B82F6;padding:120px 30px 60px;text-align:center;color:#fff}
.page-hero h1{font-family:var(--font-head);font-size:38px;font-weight:400;margin:0 0 10px}
.page-hero p{font-size:14px;color:rgba(255,255,255,0.7);max-width:600px;margin:0 auto}
.blog-page-section{max-width:1000px;margin:0 auto;padding:40px 30px 80px}
.blog-page-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px}
.blog-page-card{border-radius:6px;overflow:hidden;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,0.06);transition:box-shadow 0.2s;cursor:pointer;text-decoration:none;color:inherit;display:block}
.blog-page-card:hover{box-shadow:0 4px 20px rgba(6,47,135,0.12)}
.blog-page-card .img{height:140px;display:flex;align-items:center;justify-content:center;font-family:var(--font-head);font-size:36px;color:#fff;font-weight:500}
.blog-page-card .body{padding:18px}
.blog-page-card .tag{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:#3B82F6;margin-bottom:4px;display:block}
.blog-page-card h3{font-family:var(--font-head);font-size:17px;font-weight:400;margin:0 0 4px;color:var(--text)}
.blog-page-card p{font-size:12px;color:var(--text-muted);line-height:1.5;margin:0}
.blog-page-card .meta{font-size:10px;color:var(--text-light);margin-top:8px}

/* ===== ARTIGO ===== */
.artigo-hero{background:linear-gradient(135deg,#001a4d,#062F87);border-bottom:4px solid #3B82F6;padding:120px 30px 50px;text-align:center;color:#fff}
.artigo-hero .cat{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:2px;color:#3B82F6;margin-bottom:8px}
.artigo-hero h1{font-family:var(--font-head);font-size:34px;font-weight:400;margin:0 0 10px;max-width:700px;margin-left:auto;margin-right:auto}
.artigo-hero .meta{font-size:12px;color:rgba(255,255,255,0.6)}
.artigo-body{max-width:720px;margin:0 auto;padding:40px 30px 80px;font-size:15px;line-height:1.8}
.artigo-body h2{font-family:var(--font-head);font-size:24px;font-weight:400;margin:40px 0 12px;color:var(--text);padding-bottom:4px;border-bottom:2px solid var(--bg-grey-alt)}
.artigo-body h3{font-family:var(--font-head);font-size:18px;font-weight:400;margin:28px 0 8px;color:var(--text)}
.artigo-body p{margin:0 0 14px;color:var(--text)}
.artigo-body table{width:100%;border-collapse:collapse;margin:16px 0;font-size:13px}
.artigo-body th,.artigo-body td{border:1px solid var(--border);padding:8px 10px;text-align:left}
.artigo-body th{background:var(--bg-grey);font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:0.5px}
.artigo-body code{background:var(--bg-grey);padding:1px 5px;border-radius:3px;font-size:13px}
.artigo-body pre{background:#1e293b;color:#e2e8f0;padding:16px;border-radius:6px;overflow-x:auto;font-size:13px;line-height:1.5;margin:16px 0}
.artigo-body strong{font-weight:700}
.artigo-body em{font-style:italic}
.artigo-nav{max-width:720px;margin:0 auto;padding:0 30px 20px}
.artigo-nav a{font-size:12px;color:var(--text-muted);text-decoration:none}
.artigo-nav a:hover{color:var(--primary)}
.artigo-loading{text-align:center;padding:80px 20px;color:var(--text-muted)}

/* ===== BEARINGS ===== */
.container{max-width:800px;margin:0 auto;padding:20px}
.card{background:#fff;border-radius:10px;border:1px solid var(--border);box-shadow:0 4px 20px rgba(6,47,135,0.06);padding:24px;margin-bottom:20px}
.card-title{font-family:var(--font-head);font-size:20px;font-weight:400;color:var(--primary);margin-bottom:16px;display:flex;align-items:center;gap:8px}
.info-box{background:var(--bg-grey);padding:12px 16px;border-radius:6px;font-size:13px;color:var(--text-muted);margin-bottom:20px;border-left:3px solid var(--accent)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.form-group select,.form-group input{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:6px;font-size:14px;color:var(--text);background:var(--bg-grey);outline:none;font-family:var(--font-body)}
.form-group select:focus,.form-group input:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(6,47,135,0.1)}
.calc-btn{background:var(--primary);color:#fff;border:none;padding:12px 24px;border-radius:6px;font-family:var(--font-sub);font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;cursor:pointer;transition:all 0.3s;margin-top:8px}
.calc-btn:hover{background:var(--primary-dark)}
.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.result-item{padding:12px;background:var(--bg-grey);border-radius:6px;border-left:3px solid var(--accent)}
.result-item .label{font-size:10px;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:4px}
.result-item .value{font-size:22px;font-weight:700;color:var(--primary)}
.result-item .unit{font-size:11px;color:var(--text-light)}
.alert-box{padding:10px 14px;border-radius:6px;font-size:12px;margin-top:12px;display:flex;align-items:flex-start;gap:8px}
.alert-warning{background:rgba(255,160,0,0.1);border-left:3px solid #ffa000;color:var(--text)}
.alert-danger{background:rgba(220,38,38,0.08);border-left:3px solid #dc2626;color:var(--text)}
.alert-success{background:rgba(22,163,74,0.08);border-left:3px solid #16a34a;color:var(--text)}
.l10-tag{font-size:10px;padding:2px 8px;border-radius:10px;font-weight:700;display:inline-block}
.l10-excellent{background:rgba(22,163,74,0.15);color:#16a34a}
.l10-good{background:rgba(59,130,246,0.15);color:#3B82F6}
.l10-fair{background:rgba(255,160,0,0.15);color:#e65100}
.l10-poor{background:rgba(220,38,38,0.15);color:#dc2626}

/* ===== SPROCKET Overlay ===== */
.section-overlay{display:none;padding:70px 30px;max-width:1200px;margin:0 auto}
.section-overlay.open{display:block}
.glass{background:#fff;border:1px solid var(--border);border-radius:10px;padding:20px}
.contato-back{margin-bottom:20px}
.contato-back a{font-size:13px;color:var(--primary);font-weight:600}
.contato-back a:hover{color:var(--accent)}
.spr-badge{display:inline-block;padding:12px 20px;border-radius:6px;font-size:13px;font-weight:700;border:2px solid;min-width:140px;flex:1}
.spr-badge-icon{font-size:15px;display:block;margin-bottom:2px}
.spr-badge-label{font-size:11px;font-weight:400;margin-top:2px;opacity:0.8}
.spr-catenaria{padding:10px 16px;border-radius:6px;font-size:12px;margin-top:8px;background:var(--bg-grey);border-left:4px solid var(--border)}
.spr-catenaria b{font-family:var(--font-sub)}
.spr-emenda{padding:8px 12px;border-radius:6px;font-size:11px;margin-top:6px;background:rgba(232,96,28,0.06);border:1px solid rgba(232,96,28,0.2)}
.spr-tensionador{padding:10px 14px;border-radius:6px;font-size:12px;margin-top:10px;background:rgba(232,96,28,0.08);border-left:4px solid #E8601C}
.spr-tensionador b{color:#E8601C;display:block;margin-bottom:4px}
.spr-derivacao{padding:12px;background:var(--bg-grey);border-radius:6px;margin-top:8px;font-family:'Courier New',monospace;font-size:12px;line-height:1.8}

/* ===== REGISTER ===== */
.register-wrapper{width:100%;max-width:1000px;display:flex;gap:30px;align-items:flex-start;padding-top:140px;margin:0 auto 40px}
.register-card{background:#fff;padding:2.5rem;border-radius:10px;border:1px solid var(--border);box-shadow:0 4px 24px rgba(6,47,135,0.08);width:100%;max-width:460px;text-align:center;flex-shrink:0}
.free-badge{display:inline-block;background:rgba(22,163,74,0.1);color:#16a34a;border:1px solid #16a34a;border-radius:20px;padding:2px 14px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;margin-bottom:1rem}
.register-subtitle{color:var(--text-muted);font-size:0.85rem;margin-bottom:1.5rem}
.btn-register{width:100%;padding:14px;background:var(--primary);color:#fff;border:none;border-radius:6px;font-family:var(--font-sub);font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:1px;cursor:pointer;transition:all 0.3s;margin-top:0.5rem}
.btn-register:hover{background:var(--primary-dark)}
.btn-register:disabled{opacity:0.5;cursor:not-allowed}
.login-link{display:block;margin-top:1.2rem;color:var(--text-muted);text-decoration:none;font-size:0.85rem}
.login-link:hover{color:var(--primary)}
.login-link strong{color:var(--accent)}
.terms-note{font-size:0.72rem;color:var(--text-light);margin-top:1rem;line-height:1.4}
.preview-panel{background:#fff;border-radius:10px;border:1px solid var(--border);box-shadow:0 4px 24px rgba(6,47,135,0.08);overflow:hidden;width:100%}
.preview-header{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;padding:20px 24px}
.preview-header h3{font-family:var(--font-head);font-size:20px;font-weight:400}
.preview-header h3 span{color:var(--accent)}
.preview-header p{color:rgba(255,255,255,0.6);font-size:12px;margin-top:4px}
.preview-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-bottom:1px solid var(--border)}
.preview-stat{padding:16px;text-align:center;border-right:1px solid var(--border)}
.preview-stat:last-child{border-right:none}
.preview-stat h4{font-family:var(--font-head);font-size:22px;font-weight:500;color:var(--primary)}
.preview-stat p{color:var(--text-muted);font-size:10px;text-transform:uppercase;letter-spacing:0.5px;margin-top:2px}
.preview-features{padding:20px 24px}
.preview-feat{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--bg-grey)}
.preview-feat:last-child{border-bottom:none}
.preview-feat i,.preview-feat svg.svg-inline--fa{width:20px;text-align:center;font-size:14px}
.preview-feat i.fa-check-circle,.preview-feat svg.svg-inline--fa.fa-check-circle{color:#16a34a}
.preview-feat i.fa-lock,.preview-feat svg.svg-inline--fa.fa-lock{color:var(--text-light)}
.preview-feat .feat-text{font-size:13px;color:var(--text)}
.preview-feat .feat-tag{font-size:9px;text-transform:uppercase;letter-spacing:0.5px;font-weight:700;margin-left:auto;padding:2px 10px;border-radius:10px;flex-shrink:0}
.tag-free{background:rgba(22,163,74,0.1);color:#16a34a}
.tag-prime{background:rgba(168,85,247,0.1);color:#a855f7}
.tag-admin{background:var(--accent);color:#fff}
.preview-footer{background:var(--bg-grey);padding:14px 24px;text-align:center;font-size:12px;color:var(--text-muted)}
.register-wrapper .input-group{margin-bottom:1rem}
.register-wrapper .input-group input{padding:12px 14px;font-size:0.95rem}
.register-wrapper .error-msg,.register-wrapper .success-msg{margin-top:12px}

@media (max-width:768px) {
  .register-wrapper{flex-direction:column;align-items:center}
  .register-card{max-width:100%}
  .preview-stats{grid-template-columns:repeat(2,1fr)}
}

@media (max-width:600px) {
  .form-row{grid-template-columns:1fr}
  .result-grid{grid-template-columns:1fr}
}

@media (max-width:480px) {
  .hero-text h1 { font-size: 26px; }
  .hero-text p { font-size: 15px; }
  .hero-btn { padding: 10px 24px; font-size: 13px; }
  .hero-stat .num { font-size: 28px; }
  .section-title { font-size: 22px; }
  .section-sub { font-size: 13px; }
  .featured-tool { padding: 20px; }
  .featured-tool svg { width: 120px; height: 120px; }
  .tool-preview { display: none; }
}

@media (max-width: 768px) {
  :root { --header-h: 86px; }
  .menu-toggle { display: block; }
  .nav-list { display: none; position: absolute; top: 100%; left: 0; right: 0;
    background: var(--primary); flex-direction: column; }
  .nav-list.open { display: flex; }
  .nav-list > li > a { color: #fff; padding: 12px 20px; border-bottom: 1px solid rgba(255,255,255,0.08); }
  .hero-text h1 { font-size: 32px; }
  .tool-grid { grid-template-columns: 1fr; }
  .tools-grid { grid-template-columns: 1fr; }
  .featured-tool { flex-direction: column; padding: 28px; text-align: center; }
  .footer-inner { grid-template-columns: 1fr; }
  .hero-stats { flex-direction: column; gap: 12px; }
  .contato-grid { grid-template-columns: 1fr; }
}

/* Blog CTA hover */
.blog-cta-btn:hover { background: var(--primary) !important; color: #fff !important; }

/* Sobre collapsible (Release v1.0) */
details.sobre-details { background:var(--bg-grey); border-radius:8px; overflow:hidden; margin-top:32px; }
details.sobre-details summary { font-family:'Oswald',sans-serif; font-size:14px; font-weight:500; color:var(--text); cursor:pointer; padding:14px 20px; background:var(--border); user-select:none; list-style:none; display:flex; align-items:center; gap:10px; transition:background 0.2s,color 0.2s; }
details.sobre-details summary::-webkit-details-marker { display:none; }
details.sobre-details summary i.fa-chevron-right { font-size:13px; transition:transform 0.25s; }
details.sobre-details[open] summary i.fa-chevron-right { transform:rotate(90deg); }
details.sobre-details summary:hover { background:var(--primary); color:#fff; }
details.sobre-details .sobre-body { padding:20px 24px; font-size:13px; line-height:1.7; color:var(--text); }

/* ===== CSP-Safe Utilities (replace inline style= attributes) ===== */

/* Display */
.d-none { display: none !important; }
.d-block { display: block; }
.d-inline-block { display: inline-block; }
.d-flex { display: flex; }
.d-grid { display: grid; }
.d-table-cell { display: table-cell; }
.text-decoration-none { text-decoration: none; }
.overflow-x-auto { overflow-x: auto; }

/* Cursor */
.cursor-pointer { cursor: pointer; }
.cursor-not-allowed { cursor: not-allowed; }
.opacity-60 { opacity: 0.6; }

/* Text align */
.text-center { text-align: center; }
.text-right { text-align: right; }
.text-left { text-align: left; }

/* Text color */
.text-muted { color: var(--text-muted); }
.text-primary { color: var(--primary); }
.text-accent { color: var(--accent); }
.text-white { color: #fff; }
.text-red { color: #dc2626; }
.text-red-500 { color: #ef4444; }
.text-accent-bold { color: #3B82F6; font-weight: 700; }
.text-muted-normal { color: var(--text-muted); font-weight: 400; }

/* Font size */
.fs-9 { font-size: 9px; }
.fs-11 { font-size: 11px; }
.fs-12 { font-size: 12px; }
.fs-13 { font-size: 13px; }
.fs-14 { font-size: 14px; }
.fs-16 { font-size: 16px; }
.fs-18 { font-size: 18px; }
.fs-20 { font-size: 20px; }
.fs-24 { font-size: 24px; }
.fs-28 { font-size: 28px; }

/* Font weight */
.fw-400 { font-weight: 400; }
.fw-600 { font-weight: 600; }
.fw-700 { font-weight: 700; }

/* Font family */
.font-head { font-family: var(--font-head); }
.font-sub { font-family: var(--font-sub); }

/* Width */
.w-100 { width: 100%; }
.h-100 { height: 100%; }
.w-15 { width: 15%; }
.w-20 { width: 20%; }
.w-25 { width: 25%; }
.w-30 { width: 30%; }
.w-50 { width: 50%; }

/* Margins */
.m-0 { margin: 0; }
.mt-8 { margin-top: 8px; }
.mt-10 { margin-top: 10px; }
.mt-12 { margin-top: 12px; }
.mt-16 { margin-top: 16px; }
.mt-20 { margin-top: 20px; }
.mt-24 { margin-top: 24px; }
.mb-12 { margin-bottom: 12px; }

/* Table cells */
.td-cell { padding: 4px 8px; }
.td-center { padding: 4px 8px; text-align: center; border-bottom: 1px solid #e2e8f0; }
.td-plain { padding: 4px 8px; border-bottom: 1px solid #e2e8f0; }
.td-left { padding: 6px 8px; text-align: left; }
.td-right { padding: 8px 10px; text-align: right; }
.td-compact { padding: 2px 4px; border: 1px solid #e2e8f0; }
.td-label { padding: 2px 4px; border: 1px solid #e2e8f0; background: #f1f5f9; font-weight: 600; }
.td-center-sm { padding: 6px 8px; text-align: center; }
.td-center-xs { padding: 4px 8px; text-align: center; }
.td-section { text-align: center; padding: 24px; }

/* Badge small */
.badge-sm { font-size: 9px; padding: 1px 6px; border-radius: 3px; vertical-align: middle; }
.badge-upper { font-size: 9px; color: #94a3b8; letter-spacing: 2px; text-transform: uppercase; font-family: 'Fira Sans', sans-serif; }

/* Modal overlay */
.modal-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.6); z-index: 9999; align-items: center; justify-content: center; }
.modal-overlay.active { display: flex; }
.modal-panel { background: #fff; border-radius: 8px; max-width: 500px; width: 90%; padding: 24px; max-height: 80vh; overflow-y: auto; }
.modal-wide { background: #fff; border-radius: 8px; max-width: 900px; width: 95%; padding: 24px; max-height: 85vh; overflow-y: auto; }

/* Grid helpers */
.grid-3col { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px; max-width: 1000px; margin: 0 auto; }
.grid-2col { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; max-width: 900px; margin: 0 auto; }

/* Hero gradient */
.hero-gradient { background: linear-gradient(135deg, #001a4d, #062F87, #1a4a9f); color: #fff; padding: 40px 0; border-bottom: 4px solid #3B82F6; margin-top: var(--header-h, 140px); }

/* Tag flex pill */
.tag-pill { background: rgba(255,255,255,.15); padding: 3px 10px; border-radius: 12px; }

/* Input base */
.input-base { width: 100%; padding: 6px 10px; border: 1px solid var(--border); border-radius: 4px; }

/* Link block */
.link-block { display: block; text-decoration: none; }

/* Card styled */
.card-styled { background: var(--bg-grey); border-radius: 8px; padding: 14px; min-height: 200px; }

/* Inline text */
.text-accent-up { margin: 0 0 6px 0; font-size: 11px; color: #3B82F6; text-transform: uppercase; letter-spacing: 0.5px; }

/* Table fullwidth */
.table-full { width: 100%; border-collapse: collapse; }
.table-fs13 { width: 100%; border-collapse: collapse; font-size: 13px; }
.table-fs11 { width: 100%; border-collapse: collapse; font-size: 11px; }

/* Header title */
.h-title { font-family: var(--font-head); font-size: 18px; font-weight: 400; }
.h-lg { font-size: 28px; margin-bottom: 8px; }
.h-section { color: var(--primary); font-family: var(--font-head); font-size: 20px; font-weight: 400; margin-bottom: 8px; }

/* Input style variants */
.input-sm { padding: 6px 10px; border: 1px solid #cbd5e1; border-radius: 4px; font-size: 12px; flex: 1; min-width: 100px; }
.input-flex { padding: 5px 8px; border: 1px solid #cbd5e1; border-radius: 3px; font-size: 11px; flex: 1; min-width: 120px; }

/* Stat card */
.stat-card { padding: 8px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 12px; flex: 1; min-width: 120px; }

/* KPI badge */
.kpi-badge { background: var(--primary); color: #fff; }
.kpi-badge-inline { background: var(--bg-grey); }

/* Tiny label */
.tiny-label { margin-top: 12px; font-size: 11px; color: #64748b; }

/* Body text small */
.body-sm { font-size: 13px; color: var(--text-muted); line-height: 1.6; }
.body-sm-pl { color: #1e293b; line-height: 1.8; }

/* Text muted small */
.text-muted-sm { font-size: 12px; color: var(--text-muted); }
.text-muted-xs { margin-top: 16px; font-size: 12px; color: var(--text-muted); }

/* Font Fira heading */
.fira-heading { font-family: 'Fira Sans', sans-serif; color: #062F87; margin-top: 2rem; }

/* Meta small */
.meta-sm { font-size: 0.82rem; }
.meta-muted { color: var(--text-muted); font-size: 0.85rem; }
.meta-accent { font-size: 0.7rem; color: var(--accent); font-weight: 400; }
.fs-10 { font-size: 10px; }
.fs-14 { font-size: 14px; }
.fs-15 { font-size: 15px; }
.fs-16 { font-size: 16px; }
.fs-1-5 { font-size: 1.5rem; }
.text-light { color: var(--text-light); }
.text-red { color: #dc2626; }
.mb-10 { margin-bottom: 10px; }
.mt-40 { margin-top: 40px; }
.p-14 { padding: 14px; }
.pt-150 { padding-top: 150px; }
.fira-h14 { font-family: 'Fira Sans', sans-serif; font-size: 14px; color: #062F87; margin: 0 0 10px 0; }

/* ===== ---- UTILITY BLOCK 2 ---- ===== */
.container-900 { max-width: 900px; margin: 0 auto; }
.container-800 { max-width: 800px; margin: 0 auto; font-size: 13px; line-height: 1.7; }
.container-700 { max-width: 700px; margin: 0 auto 40px; }
.container-600 { max-width: 600px; margin: 0 auto; }
.container-600-mb40 { max-width: 600px; margin: 0 auto 40px; }
.nav-sm { padding: 5px 10px; font-size: 11px; font-weight: 600; color: #64748b; text-decoration: none; border-radius: 4px; font-family: 'Fira Sans', sans-serif; }
.body-container { max-width: 800px; margin: 0 auto; font-size: 13px; line-height: 1.7; }
.hero-sub { text-align: center; margin-top: 16px; font-size: 12px; color: var(--text-muted); max-width: 600px; margin: 16px auto 0; line-height: 1.5; }
.flex-row { display: flex; gap: 8px; flex-wrap: wrap; }
.flex-row-g10 { display: flex; gap: 10px; margin-top: 15px; flex-wrap: wrap; }
.flex-row-g12 { display: flex; gap: 12px; flex-wrap: wrap; }
.flex-between { display: flex; justify-content: space-between; align-items: center; }
.flex-between-m15 { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; }
.flex-center-g10 { display: flex; gap: 10px; justify-content: center; margin-top: 10px; font-size: 12px; flex-wrap: wrap; }
.flex-center-mt8 { display: flex; gap: 10px; margin-top: 8px; }
.grid-2col-g12 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.grid-2col-g20 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.grid-2col-g8 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.grid-2col-sm { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; font-size: 0.82rem; }
.dn-mt16 { display: none; margin-top: 16px; }
.dn-mt12 { display: none; margin-top: 12px; }
.dn-mt16-bg { display: none; margin-top: 16px; padding: 16px; background: var(--bg-grey); border-radius: 6px; }
.dn-mt12-muted { display: none; margin-top: 12px; font-size: 12px; color: var(--text-muted); }
.hidden-box { display: none; margin-top: 12px; text-align: center; background: var(--bg-grey); border-radius: 6px; padding: 10px; }
.bl-blue { border-left-color: #3B82F6; }
.bl-indigo { border-left-color: #062F87; }
.bl-green { border-left-color: #10b981; }
.bl-yellow { border-left-color: #f59e0b; }
.bl-orange { border-left-color: #ec4899; }
.bl-red { border-left-color: #ef4444; }
.bl-purple { border-left-color: #8b5cf6; }
.input-full { flex: 1; min-width: 150px; padding: 5px 8px; border: 1px solid #cbd5e1; border-radius: 3px; font-size: 11px; }
.input-sm-100 { flex: 1; min-width: 100px; padding: 5px 8px; border: 1px solid #cbd5e1; border-radius: 4px; font-size: 11px; }
.input-sm-120 { flex: 1; min-width: 120px; padding: 5px 8px; border: 1px solid #cbd5e1; border-radius: 4px; font-size: 11px; }
.input-sm-140 { flex: 1; min-width: 140px; padding: 5px 8px; border: 1px solid #cbd5e1; border-radius: 4px; font-size: 11px; }
.input-w130 { width: 130px; padding: 6px 10px; font-size: 0.8rem; border: 1px solid var(--border); border-radius: 4px; }
.input-w140 { width: 140px; padding: 6px 10px; font-size: 0.8rem; border: 1px solid var(--border); border-radius: 4px; }
.input-w180 { width: 180px; padding: 6px 10px; font-size: 0.8rem; border: 1px solid var(--border); border-radius: 4px; }
.text-muted-xs-block { font-size: 0.72rem; color: var(--text-muted); margin-top: 8px; }
.text-muted-mt10 { font-size: 12px; color: var(--text-muted); margin-top: 10px; }
.text-muted-f08 { color: var(--text-muted); font-size: 0.82rem; margin: -10px 0 12px; }
.text-muted-f085 { color: var(--text-muted); font-size: 0.85rem; margin: -10px 0 16px; }
.text-light-f12 { font-size: 12px; color: #94a3b8; line-height: 1.6; }
.text-light-075 { font-size: 0.75rem; color: var(--text-muted); margin-left: 8px; }
.text-light-078 { font-size: 0.78rem; color: var(--text-muted); margin-bottom: 6px; }
.text-meta-072 { font-size: 0.72rem; opacity: 0.8; }
.bg-grey-badge { background: rgba(59,130,246,0.2); color: #3B82F6; padding: 3px 12px; border-radius: 20px; font-size: 11px; font-weight: 600; font-family: Fira Sans, sans-serif; }
.bg-grey-light { background: var(--bg-grey); }
.bg-dark { background: #0f172a; }
.accent-bg { background: var(--accent); }
.gold-bold { color: #fbbf24; font-weight: 700; }
.hr-accent { border: none; border-top: 2px solid var(--accent); margin: 10px 0; }
.mt-8-fs13 { margin-top: 8px; font-size: 13px; }
.mt-10-full { margin-top: 10px; width: 100%; }
.mb-10-fs12 { margin-top: 10px; font-size: 12px; color: var(--text-muted); }
.fira-title { font-family: 'Fira Sans', sans-serif; font-size: 14px; color: #e2e8f0; margin: 0 0 10px 0; }
.fira-pill { padding: 4px 12px; font-size: 10px; font-weight: 700; color: #3B82F6; text-decoration: none; border: 1px solid #3B82F6; border-radius: 12px; font-family: 'Fira Sans', sans-serif; text-transform: uppercase; letter-spacing: 0.5px; }
.fira-bold-16 { font-size: 16px; font-weight: 700; letter-spacing: 1px; font-family: 'Fira Sans', sans-serif; }
.oswald-title { font-family: Oswald, sans-serif; font-size: 32px; font-weight: 500; margin: 8px 0; color: #fff; }
.oswald-section { font-family: 'Oswald', sans-serif; font-size: 2rem; font-weight: 500; color: #062F87; margin-bottom: 2rem; }
.fs-10-upper { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; color: var(--text-muted); }
.td-left-p8 { padding: 8px 10px; text-align: left; }
.mt-24-p12 { margin-top: 24px; }
.tc-mt24 { text-align: center; margin-top: 24px; }
.mt-15-bt { margin-top: 15px; border-top: 2px solid var(--border); padding-top: 16px; }
.mb-2rem { color: #64748b; margin-bottom: 2rem; }
.flex-ac { display: flex; align-items: center; gap: 8px; }
.flex-ac-g10 { display: flex; align-items: center; gap: 10px; }
.flex-ac-flexend { display: flex; align-items: flex-end; padding-bottom: 4px; }
.flex-jc { display: flex; justify-content: center; gap: 8px; }
.flex-sb-ac { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; }
.dib-mr4 { display: inline-block; margin-right: 4px; }
.dib-btn { display: inline-block; padding: 8px 20px; border: 1px solid var(--primary); border-radius: 4px; color: var(--primary); font-size: 12px; text-decoration: none; font-weight: 700; letter-spacing: 0.5px; transition: 0.2s; }
.w-80 { width: 80px; }
.w-240 { max-width: 240px; width: 100%; }
.ml-auto-fs10 { margin-left: auto; font-size: 10px; color: #94a3b8; font-weight: 400; }
.text-secondary-body { color: var(--text-secondary); line-height: 1.8; margin-bottom: 20px; }
.fs-13-lh17 { font-size: 13px; line-height: 1.7; }
.mt-12-tc { margin-top: 12px; font-size: 12px; color: #64748b; text-align: center; }
.p-0-tp { padding: 0; background: transparent; }
.max-320 { max-width: 320px; width: 100%; height: auto; }
.max-800 { max-width: 800px; margin: 0 auto; }
.ml-6-fs10 { margin-left: 6px; font-size: 10px; }
.p16-fs12 { padding: 16px; font-size: 12px; }
.grid-2col-g6-sm { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; font-size: 0.82rem; }
.grid-3col-g8 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; margin-top: 10px; }
.grid-1fr { grid-column: 1/-1; }
.grid-1fr-flex { grid-column: 1/-1; display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.fs-15-m16 { font-size: 15px; margin: 16px 0 4px; }
.fs-14-wh08 { font-size: 14px; color: rgba(255,255,255,0.8); max-width: 600px; margin: 0 auto; }
.cp-text { cursor: pointer; padding: 2px 5px; color: #94a3b8; }
.cp-primary { cursor: pointer; padding: 2px 5px; color: #062F87; }
.fs-0-75 { font-size: 0.75rem; }
.fs-0-7 { font-size: 0.7rem; }
.fs-0-82 { font-size: 0.82rem; }
.fs-1-3 { font-size: 1.3rem; }
.fs-10-cp { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; cursor: pointer; color: var(--text-muted); }
.fs-11-block { font-size: 11px; color: var(--text-muted); display: block; padding-top: 8px; }
.fs-11-flex1 { font-size: 11px; color: var(--text-muted); font-weight: 600; flex: 1; }
.fs-12-mb10 { font-size: 12px; color: var(--text-muted); margin-bottom: 10px; }
.fs-12-mb12 { font-size: 12px; color: var(--text-muted); margin-bottom: 12px; }
.fs-12-primary-ul { font-size: 12px; font-weight: 400; color: var(--accent); text-decoration: underline; cursor: pointer; }
.fs-12-input { font-size: 12px; padding: 4px 8px; border: 1px solid #cbd5e1; border-radius: 4px; }
.dn-mt8 { display: none; margin-top: 8px; }
.dn-mt20 { display: none; margin-top: 20px; }
.ml-20 { margin-left: 20px; }
.mt-16-p12 { margin-top: 16px; padding: 12px 14px; background: var(--bg-grey); border-radius: 8px; }
.border-mt24 { border-color: var(--border); margin: 24px 0; }
.hr-none { border: none; border-top: 1px solid var(--border); margin: 10px 0; }
.mt-6-br4 { margin-top: 6px; border-radius: 4px; background: #f8fafc; width: 100%; height: 80px; }
.mt-8-p8-red { margin-top: 8px; padding: 8px; background: #fef2f2; border-radius: 6px; }
.dn-mt16-bg { display: none; margin-top: 16px; padding: 16px; background: var(--bg-grey); border-radius: 6px; }
.img-max600 { width: 100%; max-width: 600px; height: auto; margin: 10px auto; display: block; }
.p-12-bold { padding: 12px 16px; font-weight: 700; font-size: 13px; color: #062F87; cursor: pointer; user-select: none; list-style: none; display: flex; align-items: center; gap: 8px; border-bottom: 1px solid #e2e8f0; }
.p16-fs12-lh17 { padding: 16px; font-size: 12px; line-height: 1.7; color: #1e293b; }
.w-16-check { width: 16px; height: 16px; accent-color: var(--primary); }
.dn-print { display: none; background: #fff; padding: 20px 32px; font-family: Roboto, sans-serif; font-size: 10pt; line-height: 1.5; max-width: 900px; margin: 0 auto; color: #1e293b; }
.grid-2col-g16 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.grid-2col-g8-fs1 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; font-size: 1rem; }
.fs-13-mb8 { font-size: 13px; margin-bottom: 8px; }
.fs-16-m0-o9 { font-size: 16px; margin: 0; opacity: .9; }
.fw-700-fs12 { font-weight: 700; font-size: 12px; color: var(--primary); margin-bottom: 6px; }
.p8-border { padding: 8px; border: 1px solid var(--border); border-radius: 6px; font-family: inherit; font-size: 13px; background: #fff; }
.p6-border { padding: 6px 10px; border: 1px solid var(--border); border-radius: 4px; font-size: 12px; }
.checkbox-w16 { width: 16px; height: 16px; accent-color: var(--primary); }
.text-muted-f082 { color: var(--text-muted); font-size: 0.82rem; }
.text-secondary-f085 { color: var(--text-secondary); font-size: 0.85rem; margin-right: auto; }
.fs-0-8-block { font-size: 0.8rem; color: var(--text-muted); display: block; margin-bottom: 8px; }
.fs-0-8-mb8 { font-size: 0.8rem; color: var(--text-muted); margin-bottom: 8px; }
.mb-15 { margin-bottom: 15px; }
.mb-8 { margin-bottom: 8px; }
.mt-15 { margin-top: 15px; }
.ml-6 { margin-left: 6px; font-size: 10px; }
.max-1000 { padding: 30px 20px; max-width: 1000px; margin: 0 auto; }
.p40-r12 { padding: 40px; border-radius: 12px; }
.p16-flex-end { padding: 16px 24px; margin-bottom: 20px; display: flex; justify-content: flex-end; align-items: center; gap: 12px; flex-wrap: wrap; }
.fs-12-cl { font-size: 12px; color: var(--text-light); }
.m-10-0-0 { margin: 10px 0 0 0; font-size: 10px; color: #94a3b8; text-align: center; }
.p40-bg { padding: 40px 20px; background: #f1f5f9; }
.grid-2col-cs { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; color: var(--text-secondary); }
.fs-10-fw700 { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; color: var(--text-muted); }
.flex-wrap-ac { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.flex-wrap-p8 { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 10px; background: #f1f5f9; border-radius: 6px; margin-bottom: 8px; grid-column: 1/-1; }

/* ===== UX STATES: Loading / Empty / Error ===== */
.ux-loading,
.ux-empty,
.ux-error {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 40px 20px; text-align: center; min-height: 120px;
  font-family: var(--font-sub); font-size: 13px; color: var(--text-muted);
}
.ux-loading .spinner {
  width: 28px; height: 28px; border: 3px solid var(--border);
  border-top-color: var(--primary); border-radius: 50%;
  animation: ux-spin 0.7s linear infinite; margin-bottom: 10px;
}
@keyframes ux-spin { to { transform: rotate(360deg); } }
.ux-loading .msg { font-size: 12px; color: var(--text-muted); }
.ux-empty .icon { font-size: 32px; color: var(--border); margin-bottom: 8px; }
.ux-empty .msg { font-size: 13px; color: var(--text-muted); }
.ux-empty .hint { font-size: 11px; color: var(--text-muted); margin-top: 4px; opacity: 0.7; }
.ux-error .icon { font-size: 28px; color: var(--danger); margin-bottom: 8px; }
.ux-error .msg { font-size: 13px; color: var(--danger); }
.ux-error .hint { font-size: 11px; color: var(--text-muted); margin-top: 4px; }
.ux-error .retry-btn {
  margin-top: 12px; padding: 6px 16px;
  background: var(--primary); color: #fff; border: none; border-radius: 4px;
  cursor: pointer; font-family: var(--font-sub); font-size: 11px; font-weight: 700;
}
.ux-error .retry-btn:hover { background: var(--primary-dark); }

/* ===== ---- PRINT ---- ===== */
/* Print-only classes (no conflict with Report System below).
   Conflicting classes (.report-header, .report-section-title, .report-table,
   .report-alert, .report-footer, .report-sub) are defined in Report System section. */
#report-wrapper { padding: 8px 14px; font-family: var(--font-body); color: #000; max-width: 100%; margin: 0 auto; font-size: 8.5pt; line-height: 1.35; print-color-adjust: exact; -webkit-print-color-adjust: exact; }

.report-kpi { display: flex; gap: 2px; margin-bottom: 5px; font-size: 7.5pt; }
.report-kpi-item { flex: 1; border: 1.5px solid #000; padding: 2px 4px; text-align: center; background: #f5f5f5; }
.report-kpi-item .kpi-label { font-size: 6pt; font-weight: 700; text-transform: uppercase; }
.report-kpi-item .kpi-label .kpi-sub { font-size: 5pt; font-weight: 400; text-transform: none; }
.report-kpi-item .kpi-value { font-size: 9.5pt; font-weight: 700; }
.report-kpi-item .kpi-value .kpi-unit { font-size: 6.5pt; font-weight: 400; }

.report-grid-2 { display: flex; gap: 5px; margin-bottom: 4px; }
.report-grid-2 > * { flex: 1; }

.report-status-box { border: 1.5px solid; padding: 3px 5px; font-size: 7.5pt; font-weight: 700; text-align: center; margin-bottom: 2px; }
.report-status-ok { border-color: #090; background: #f0fff0; }
.report-status-fail { border-color: #c00; background: #fff0f0; }
.report-vib-box { border: 1.5px solid; padding: 3px 5px; font-size: 7.5pt; }
.report-vib-label { font-weight: 700; }
.report-vib-dv { margin-left: 5px; color: #555; }

.report-interference { border: 1.5px solid #c00; padding: 3px 6px; background: #fff0f0; font-size: 7.5pt; color: #c00; font-weight: 700; margin-top: 4px; }

/* Brand block (used by sprocket report header) */
.report-brand { text-align: right; }
.report-brand .brand-name { font-size: 12pt; font-weight: 700; font-family: var(--font-head); }
.report-brand .brand-stamp { font-size: 6.5pt; color: #888; }

@media print {
  body > *:not(#print-report) { display: none !important; }
  #print-report { display: block !important; width: 100%; background: #fff; print-color-adjust: exact; -webkit-print-color-adjust: exact; margin: 0; padding: 0; }
  #print-report * { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  #report-wrapper { padding: 6px 10px; font-size: 7.5pt; }
  .report-kpi { gap: 1px; }
  .report-kpi-item { padding: 1px 3px; }
  .report-kpi-item .kpi-value { font-size: 8.5pt; }
  .report-table { font-size: 7pt; }
  .report-table th, .report-table td { padding: 1px 2px; }
  .report-header h1 { font-size: 11pt; }
  @page { margin: 6mm 8mm; size: A4 portrait; }
}

/* ============================================================
   REPORT SYSTEM — classes for gerarRelatorio() inline styles
   ============================================================ */

/* Container */
.report-wrap { max-width: 720px; margin: 0 auto; font-family: inherit; color: #000; font-size: 7.5pt; line-height: 1.25; }

/* Header block */
.report-header { text-align: center; margin-bottom: 10px; padding-bottom: 6px; border-bottom: 2px solid var(--primary); display: flex; justify-content: space-between; align-items: center; }
.report-header h1 { font-size: 14px; font-weight: 700; color: var(--primary); margin: 0; font-family: 'Oswald', sans-serif; }
.report-header p { font-size: 8px; color: var(--text-muted); margin: 0; }

/* KPI bar in reports (fixed 6-column grid) */
.report-kpi-grid { display: grid; grid-template-columns: repeat(6,1fr); gap: 4px; margin-bottom: 10px; }
.report-kpi-box { background: var(--bg-grey); padding: 3px 6px; border-radius: 4px; text-align: center; }
.report-kpi-box .val { font-size: 13px; font-weight: 700; color: var(--primary); }
.report-kpi-box .lbl { font-size: 7px; color: var(--text-muted); margin-top: 1px; }

/* Badge status in reports */
.report-badge-ok { display: inline-block; padding: 1px 5px; border-radius: 2px; font-size: 6.5pt; font-weight: 700; text-transform: uppercase; background: #d1fae5; color: #065f46; }
.report-badge-fail { display: inline-block; padding: 1px 5px; border-radius: 2px; font-size: 6.5pt; font-weight: 700; text-transform: uppercase; background: #fee2e2; color: #991b1b; }

/* Section rows */
.report-section-title { font-size: 10px; font-weight: 700; color: var(--primary); margin: 0 0 4px; font-family: 'Fira Sans', sans-serif; border-bottom: 1px solid var(--primary); padding-bottom: 2px; }
.report-section { margin-bottom: 8px; }

/* Tables inside reports */
.report-table { width: 100%; border-collapse: collapse; font-size: 6.5pt; margin-bottom: 4px; }
.report-table th { background: var(--primary); color: #fff; padding: 2px 4px; text-align: left; font-size: 6.5pt; }
.report-table td { padding: 1px 4px; border-bottom: 1px solid var(--border); }
.report-table td.right { text-align: right; }
.report-table td.center { text-align: center; }
/* Vertical lines between columns */
.report-table th:not(:last-child),
.report-table td:not(:last-child) { border-right: 1px solid var(--border); }
.report-table-detail td:first-child { border-right: 1px solid var(--border); }

/* Alerts box in reports */
.report-alert { padding: 1px 4px; margin: 0; font-size: 6.5pt; border-left: 2px solid #3b82f6; background: #f8fafc; }
.report-alert strong { color: #3b82f6; }
.report-alert.danger { background: #fef2f2; border-left-color: #dc2626; }
.report-alert.warning { background: #fffbeb; border-left-color: #f59e0b; }
.report-alert.info { background: #eff6ff; border-left-color: #3b82f6; }

/* Derived derivation blocks */
.report-derivation { padding: 12px; background: var(--bg-grey); border-radius: 4px; margin-top: 8px; font-family: monospace; font-size: 12px; line-height: 1.8; white-space: pre-wrap; }
summary.report-summary { cursor: pointer; font-weight: 700; color: var(--primary); font-size: 13px; }

/* Lead form within reports */
.report-lead { margin-bottom: 16px; padding: 12px; background: var(--bg-grey); border-radius: 6px; }
.report-lead input, .report-lead select { font-size: 12px; padding: 4px 8px; border: 1px solid var(--border); border-radius: 4px; }

/* Footer / signature */
.report-footer { text-align: center; margin-top: 10px; padding-top: 6px; border-top: 1px solid var(--border); font-size: 6.5pt; color: var(--text-muted); }

/* Title / heading / subtitle */
.report-title { color: var(--primary); font-size: 20px; font-weight: 700; margin: 0 0 4px 0; font-family: 'Oswald', sans-serif; }
.report-sub { color: var(--text-muted); font-size: 12px; margin: 0 0 16px 0; }

/* KPI colored cards — primary (first) and dark (remaining) */
.report-kpi-primary { background: var(--primary); color: #fff; padding: 8px; border-radius: 6px; text-align: center; }
.report-kpi-dark { background: #1e293b; color: #fff; padding: 8px; border-radius: 6px; text-align: center; }
.report-kpi-val { font-size: 18px; font-weight: 700; }
.report-kpi-lbl { font-size: 10px; }

/* Detail table (no header row, label/value pairs) */
.report-table-detail { width: 100%; border-collapse: collapse; font-size: 7pt; margin-bottom: 4px; }
.report-cell-label { padding: 1px 4px; border: 1px solid var(--border); font-weight: 700; font-size: 7pt; }
.report-cell { padding: 1px 4px; border: 1px solid var(--border); font-size: 7pt; }

/* Derivation paragraphs */
.report-derivation-p { font-size: 11px; }

/* Text colors for alerts / status */
.report-text-success { font-size: 7pt; color: #16a34a; }
.report-text-danger { font-size: 7pt; color: #dc2626; }
.report-text-muted { font-size: 7pt; color: var(--text-muted); }

/* References list in reports */
.report-ref-list { margin: 0; padding-left: 16px; font-size: 7pt; }

/* Inventory table header for tecnotool report */
.report-inventory-header th { padding: 6px 8px; }

/* ===== Wide screens (U23) ===== */
@media (min-width: 1440px) {
  .header-top-inner { max-width: 1600px; }
  .hero-content { max-width: 1400px; margin: 0 auto; }
  .footer-inner { max-width: 1600px; }
  .tools-grid { max-width: 1400px; margin-left: auto; margin-right: auto; }
  .section > div { max-width: 1400px; margin-left: auto; margin-right: auto; }
}






/* ===== REGRAS GLOBAIS DE TIPOGRAFIA DE ENGENHARIA & RELATÓRIOS A4 ===== */
#print-report, .report-page, .tprod-a4-page, .tb2-print-container, .tq-proposal-wrap {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  color: #0f172a !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.report-table, .tprod-cad-table, .tb2-print-table, .tq-table, .calc-table {
  font-variant-numeric: tabular-nums;
  font-feature-settings: 'tnum' 1;
}

.report-mono, .report-pn, .report-part, .mono-code, .tprod-cad-table td:nth-child(2) {
  font-family: 'JetBrains Mono', 'SFMono-Regular', Consolas, monospace;
  font-feature-settings: 'tnum' 1, 'zero' 1;
}

@media screen {
  #print-report {
    display: none !important;
  }
}

@media print {
  #print-report {
    display: block !important;
  }
}

/* ===== MSG USER STATUS BADGE (STATUS DE MESSENGER - LUA & ESTRELAS DE 1 A 5 PONTAS) ===== */
.msg-user-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  position: relative;
  margin: 0 4px;
  cursor: help;
}

.msg-status-dot {
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 1px 3px rgba(0,0,0,0.25), inset 0 0 0 1px rgba(255,255,255,0.25);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  position: relative;
}

.msg-status-dot:hover {
  transform: scale(1.15);
}

.msg-status-dot svg {
  display: block;
}

/* Nivel 0: Lua Cinza / Slate Sideral */
.msg-status-dot.level-0 {
  background: linear-gradient(135deg, #475569, #1e293b);
  color: #e2e8f0;
  box-shadow: 0 0 6px rgba(100, 116, 139, 0.4), inset 0 0 0 1px rgba(226, 232, 240, 0.3);
}

/* Nivel 1: Estrela 1 Ponta - Verde Esmeralda Messenger */
.msg-status-dot.level-1 {
  background: linear-gradient(135deg, #10b981, #047857);
  color: #ffffff;
  box-shadow: 0 0 6px rgba(16, 185, 129, 0.5), inset 0 0 0 1px rgba(255, 255, 255, 0.4);
}

/* Nivel 2: Estrela 2 Pontas - Ciano / Teal */
.msg-status-dot.level-2 {
  background: linear-gradient(135deg, #06b6d4, #0891b2);
  color: #ffffff;
  box-shadow: 0 0 6px rgba(6, 182, 212, 0.5), inset 0 0 0 1px rgba(255, 255, 255, 0.4);
}

/* Nivel 3: Estrela 3 Pontas - Azul Royal / Safira */
.msg-status-dot.level-3 {
  background: linear-gradient(135deg, #3b82f6, #1d4ed8);
  color: #ffffff;
  box-shadow: 0 0 6px rgba(59, 130, 246, 0.5), inset 0 0 0 1px rgba(255, 255, 255, 0.4);
}

/* Nivel 4: Estrela 4 Pontas - Ambar / Ouro Alaranjado */
.msg-status-dot.level-4 {
  background: linear-gradient(135deg, #f59e0b, #b45309);
  color: #ffffff;
  box-shadow: 0 0 8px rgba(245, 158, 11, 0.6), inset 0 0 0 1px rgba(255, 255, 255, 0.4);
}

/* Nivel 5: Estrela 5 Pontas - God Mode (Dourado Imperial com Glow) */
.msg-status-dot.level-5 {
  background: linear-gradient(135deg, #f59e0b, #d97706, #b45309);
  color: #fef08a;
  box-shadow: 0 0 10px rgba(251, 191, 36, 0.8), inset 0 0 0 1px rgba(254, 240, 138, 0.6);
  animation: pulseGoldGlow 2.5s infinite alternate;
}

@keyframes pulseGoldGlow {
  0% { box-shadow: 0 0 6px rgba(251, 191, 36, 0.6), inset 0 0 0 1px rgba(254, 240, 138, 0.5); }
  100% { box-shadow: 0 0 14px rgba(251, 191, 36, 0.95), inset 0 0 0 1px rgba(254, 240, 138, 0.8); }
}


/* ===== COMPACT ENGINEERING HERO UNIFICADO ===== */
.compact-hero, .hero.compact-hero, .tp-hero.compact-hero, .tq-hero.compact-hero, .td-hero.compact-hero, .t3d-hero.compact-hero {
  background: linear-gradient(180deg, #090d16 0%, #0f172a 100%) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  padding: 12px 24px !important;
  margin-top: var(--header-h, 86px) !important;
  position: relative;
  z-index: 10;
}
.compact-hero .compact-hero-header, .tp-hero-header, .tq-hero-header, .td-hero-header, .t3d-hero-header {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.compact-hero h1, .tp-hero-content h1, .tq-hero-content h1, .td-hero-content h1, .t3d-hero-content h1 {
  font-family: var(--font-body) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #f8fafc !important;
  margin: 0 !important;
  display: inline-flex;
  align-items: center;
  letter-spacing: -0.3px;
}
.compact-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 9px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 9999px;
  font-size: 11px;
  font-weight: 600;
  color: #94a3b8;
  letter-spacing: 0.3px;
  font-family: var(--font-body);
}
.compact-hero p, .tp-hero-sub, .tq-hero-sub, .td-hero-sub, .t3d-hero-sub {
  font-size: 12px !important;
  color: #64748b !important;
  margin: 3px 0 0 0 !important;
  line-height: 1.4 !important;
  font-family: var(--font-body) !important;
}

/* Header Top Executivo */
.header-top {
  background: #070b14 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
  padding: 4px 0 !important;
}
.header-top a {
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: 11px !important;
}
.header-top a:hover {
  color: #38bdf8 !important;
}
.platform-badge {
  color: #94a3b8;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

/* Header Main Executivo */
.header-main {
  padding: 8px 30px !important;
  background: #ffffff !important;
  border-bottom: 1px solid #e2e8f0 !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.03);
}
.logo-icon {
  width: 36px !important;
  height: 36px !important;
  font-size: 15px !important;
  border-radius: 8px !important;
}
.logo-text {
  font-size: 22px !important;
  font-weight: 700 !important;
}
.nav-list > li > a {
  padding: 6px 12px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
}

/* ===== TAB PRECOS ADMIN ===== */
.tab-precos-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; padding: 16px 0; }
.tab-precos-full { grid-column: 1 / -1; }
.tab-precos-card { border: 1px solid #e2e8f0; border-radius: 8px; overflow: hidden; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.06); }
.tab-precos-card h3 { margin: 0; padding: 10px 14px; background: #f8fafc; border-bottom: 1px solid #e2e8f0; font-size: 13px; font-weight: 700; color: #004481; display: flex; align-items: center; gap: 8px; }
.tab-precos-card h3 i { font-size: 16px; color: #004481; }
.tab-precos-card table { width: 100%; border-collapse: collapse; font-size: 12px; }
.tab-precos-card th { background: #f1f5f9; padding: 6px 10px; text-align: left; font-weight: 600; color: #334155; border-bottom: 1px solid #e2e8f0; }
.tab-precos-card td { padding: 5px 10px; border-bottom: 1px solid #f1f5f9; }
.tab-precos-card tr:hover td { background: #f8fafc; }
.tab-precos-card input, .tab-precos-card select { width: 90px; padding: 4px 6px; border: 1px solid #cbd5e1; border-radius: 4px; font-size: 12px; text-align: right; }
.tab-precos-card input:focus { border-color: #004481; outline: none; box-shadow: 0 0 0 2px rgba(0,68,129,0.15); }
.tab-precos-actions { grid-column: 1 / -1; display: flex; gap: 10px; justify-content: flex-end; padding: 12px 0 0; }
.tab-precos-actions button { padding: 8px 18px; border: none; border-radius: 6px; font-size: 13px; font-weight: 600; cursor: pointer; transition: all .15s; }
.btn-precos-save { background: #004481; color: #fff; }
.btn-precos-save:hover { background: #003366; }
.btn-precos-reset { background: #dc2626; color: #fff; }
.btn-precos-reset:hover { background: #b91c1c; }
.tab-precos-toast { position: fixed; bottom: 20px; right: 20px; padding: 12px 20px; border-radius: 8px; color: #fff; font-weight: 600; font-size: 13px; z-index: 9999; animation: fadeInUp 0.3s ease; }
.tab-precos-toast.success { background: #16a34a; }
.tab-precos-toast.error { background: #dc2626; }


/* ===== MSG AUTO-UPDATE BANNER (common.js) ===== */
.msg-upd-banner{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:100000;display:flex;align-items:center;gap:14px;max-width:min(680px,calc(100vw - 32px));padding:14px 18px;border-radius:14px;background:linear-gradient(135deg,#004481,#002b55);color:#fff;border:1px solid rgba(255,255,255,.18);box-shadow:0 12px 40px rgba(0,20,60,.45);font-family:inherit;animation:msgUpdIn .35s ease-out}
.msg-upd-icon{font-size:20px;color:#fbbf24;animation:msgUpdSpin 2.4s linear infinite}
.msg-upd-text{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0;font-size:13px;line-height:1.35}
.msg-upd-desc{opacity:.85;font-size:12px}
.msg-upd-btn{border:none;border-radius:9px;padding:8px 14px;font-weight:700;font-size:12px;cursor:pointer;white-space:nowrap;transition:transform .15s,background .15s}
.msg-upd-btn:hover{transform:translateY(-1px)}
.msg-upd-btn-now{background:#fbbf24;color:#1f2937}
.msg-upd-btn-now:hover{background:#f59e0b}
.msg-upd-btn-later{background:rgba(255,255,255,.12);color:#fff}
.msg-upd-btn-later:hover{background:rgba(255,255,255,.22)}
@keyframes msgUpdIn{from{opacity:0;transform:translate(-50%,16px)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes msgUpdSpin{to{transform:rotate(360deg)}}
@media (max-width:560px){.msg-upd-banner{flex-wrap:wrap;bottom:12px}.msg-upd-text{flex-basis:calc(100% - 40px)}}
@media print{.msg-upd-banner{display:none!important}}