/* ============================================================
   Fontes self-hosted (Space Grotesk + Inter).
   Substitui o <link> para fonts.googleapis.com nesta rota.
   Mesmo padrao de public/webflow-css/google-fonts.css:
   um @font-face por peso x subset, com unicode-range do Google.
   Inter reaproveita os arquivos ja existentes em /fonts/inter-v20/.
   ============================================================ */

/* space grotesk latin-ext 500 */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/space-grotesk/space-grotesk-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* space grotesk latin 500 */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/space-grotesk/space-grotesk-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* space grotesk latin-ext 600 */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/space-grotesk/space-grotesk-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* space grotesk latin 600 */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/space-grotesk/space-grotesk-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* space grotesk latin-ext 700 */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fonts/space-grotesk/space-grotesk-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* space grotesk latin 700 */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fonts/space-grotesk/space-grotesk-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* inter latin-ext 400 */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/inter-v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa25L7SUc.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* inter latin 400 */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/inter-v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* inter latin-ext 500 */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/inter-v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa25L7SUc.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* inter latin 500 */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/fonts/inter-v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* inter latin-ext 600 */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/inter-v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa25L7SUc.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* inter latin 600 */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/fonts/inter-v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* inter latin-ext 700 */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fonts/inter-v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa25L7SUc.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* inter latin 700 */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/fonts/inter-v20/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ============================================================
   Panorama das Vendas Industriais 2026
   CSS escopado, portado do projeto de origem (Pesquisa v3).
   TUDO prefixado por .panorama-scope para nao vazar para o
   resto do site (home, /intelligence, /clientes, verbatim).
   Carregado apenas pela rota /pesquisas/panorama-vendas-industria-2026.
   ============================================================ */

.panorama-scope {
  background-color: #122A4A;
  color: #FFFFFF;
  font-family: "Inter", system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}

.panorama-scope h1,
.panorama-scope h2,
.panorama-scope h3,
.panorama-scope h4,
.panorama-scope h5,
.panorama-scope h6,
.panorama-scope .font-display {
  font-family: "Space Grotesk", system-ui, sans-serif;
  letter-spacing: -0.02em;
  text-wrap: balance;
}

.panorama-scope p {
  text-wrap: pretty;
}

.panorama-scope button,
.panorama-scope a,
.panorama-scope [role="button"],
.panorama-scope summary {
  cursor: pointer;
}

.panorama-scope #section-scroll {
  scroll-behavior: smooth;
}

/* ---------- utilities portadas do @utility da origem ---------- */

.panorama-scope .glass {
  background: #071529;
  border: 0;
  box-shadow: none;
  backdrop-filter: none;
}

.panorama-scope .glass-strong {
  background: #071529;
  border: 0;
  box-shadow: none;
  backdrop-filter: none;
}

.panorama-scope .glow-blue {
  box-shadow: 0 0 60px -10px rgba(58,134,255,0.5), 0 0 120px -40px rgba(23,91,255,0.4);
}

.panorama-scope .text-gradient-blue {
  background: linear-gradient(135deg, #FFFFFF 0%, #BFD8FF 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.panorama-scope .bg-hero-gradient {
  background:
    radial-gradient(ellipse 80% 60% at 20% 10%, rgba(23,91,255,0.25), transparent 60%),
    radial-gradient(ellipse 60% 60% at 90% 90%, rgba(58,134,255,0.20), transparent 60%),
    linear-gradient(180deg, #071529 0%, #0A1F42 100%);
}

.panorama-scope .bg-section-alt {
  background: linear-gradient(180deg, #F5F7FA 0%, #FFFFFF 100%);
  color: #071529;
}

.panorama-scope .dot-grid {
  background-image: radial-gradient(rgba(191,216,255,0.12) 1px, transparent 1px);
  background-size: 24px 24px;
}

/* ============================================================
   Light-theme section overrides
   Aplicado quando um <Section theme="light" /> emite data-theme="light".
   Mantem as cores de dado (azul/verde/vermelho); inverte texto e superficies.
   CRITICO: 6 das 15 secoes escrevem classes de tema escuro no JSX e
   dependem 100% deste bloco para nao ficarem ilegiveis.
   ============================================================ */

.panorama-scope [data-theme="light"] {
  color: #071529;
}

.panorama-scope [data-theme="light"] .dot-grid {
  background-image: radial-gradient(rgba(7,21,41,0.10) 1px, transparent 1px);
}

.panorama-scope [data-theme="light"] .text-white { color: #071529; }
.panorama-scope [data-theme="light"] .text-white\/90 { color: rgba(7,21,41,0.9); }
.panorama-scope [data-theme="light"] .text-white\/80 { color: rgba(7,21,41,0.8); }
.panorama-scope [data-theme="light"] .text-\[\#C8D2E1\] { color: #334155; }
.panorama-scope [data-theme="light"] .text-\[\#C8D2E1\]\/80 { color: rgba(51,65,85,0.85); }
.panorama-scope [data-theme="light"] .text-\[\#C8D2E1\]\/70 { color: rgba(51,65,85,0.85); }
.panorama-scope [data-theme="light"] .text-\[\#C8D2E1\]\/60 { color: rgba(51,65,85,0.8); }
.panorama-scope [data-theme="light"] .text-\[\#BFD8FF\] { color: #175BFF; }
.panorama-scope [data-theme="light"] .text-\[\#3A86FF\] { color: #175BFF; }
.panorama-scope [data-theme="light"] .text-\[\#BFD8FF\]\/80 { color: rgba(23,91,255,0.8); }

.panorama-scope [data-theme="light"] .text-gradient-blue {
  background: linear-gradient(135deg, #071529 0%, #175BFF 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.panorama-scope [data-theme="light"] .glass {
  background: #FFFFFF;
  border: 0;
  box-shadow: none;
}

.panorama-scope [data-theme="light"] .glass-strong {
  background: #FFFFFF;
  border: 0;
  box-shadow: none;
}

.panorama-scope [data-theme="light"] .border-white\/5,
.panorama-scope [data-theme="light"] .border-white\/10,
.panorama-scope [data-theme="light"] .border-white\/15,
.panorama-scope [data-theme="light"] .border-white\/20 { border-color: rgba(7,21,41,0.12); }
.panorama-scope [data-theme="light"] .bg-white\/5 { background-color: rgba(23,91,255,0.06); }
.panorama-scope [data-theme="light"] .bg-white\/\[0\.02\] { background-color: rgba(23,91,255,0.03); }
.panorama-scope [data-theme="light"] .divide-white\/10 > * + * { border-color: rgba(7,21,41,0.12); }

.panorama-scope [data-theme="light"] .recharts-cartesian-axis-tick text,
.panorama-scope [data-theme="light"] .recharts-cartesian-axis-tick tspan { fill: #5E6B7A !important; }
.panorama-scope [data-theme="light"] .recharts-reference-line line { stroke: rgba(7,21,41,0.35) !important; }

.panorama-scope [data-theme="light"] .recharts-label-list text,
.panorama-scope [data-theme="light"] .recharts-label-list tspan { fill: #071529 !important; }

.panorama-scope [data-theme="light"] .text-neon-green { color: #3A86FF; }

/* ---------- prefers-reduced-motion ---------- */

@media (prefers-reduced-motion: reduce) {
  .panorama-scope #section-scroll { scroll-behavior: auto !important; }
  .panorama-scope *,
  .panorama-scope ::before,
  .panorama-scope ::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ============================================================
   Reveal (entrada por scroll) — CSS puro, substitui o motion.div.
   O estado inicial vem da classe .pano-reveal, adicionada pelo
   cliente num layout effect: no SSR / sem JS o conteudo fica visivel.
   ============================================================ */

.panorama-scope .pano-reveal {
  opacity: 0;
  transform: translateY(24px);
  filter: blur(6px);
  transition-property: opacity, transform, filter;
  transition-duration: 0.8s;
  transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}

.panorama-scope .pano-reveal.pano-reveal-in {
  opacity: 1;
  transform: none;
  filter: none;
}

@media (prefers-reduced-motion: reduce) {
  .panorama-scope .pano-reveal {
    opacity: 1;
    transform: none;
    filter: none;
    transition: none;
  }
}
