/**
 * W3 Styles — Standalone CSS
 * ===========================
 * Use junto com w3-effects.js no CMS.
 * Todas as classes usadas no template-cms.html estão aqui.
 * Nenhum inline style necessário.
 */

/* ========================================
   DESIGN TOKENS
   ======================================== */
:root {
  --background: 0 0% 100%;
  --foreground: 0 0% 13%;
  --primary: 209 100% 28%;
  --primary-foreground: 0 0% 100%;
  --secondary: 24 100% 50%;
  --secondary-foreground: 0 0% 100%;
  --muted: 210 20% 96%;
  --muted-foreground: 0 0% 40%;
  --accent: 24 100% 50%;
  --border: 210 20% 90%;
  --editorial-dark: 0 0% 8%;
  --editorial-gray: 0 0% 40%;
  --editorial-light: 0 0% 96%;
  --editorial-divider: 0 0% 85%;
  --radius: 0.25rem;
}

/* ========================================
   RESET & BASE
   ======================================== */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; border-color: hsl(var(--border)); }
html { scroll-behavior: smooth; }
body {
  font-family: 'Inter', -apple-system, sans-serif;
  background: hsl(var(--background));
  color: hsl(var(--foreground));
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
a { text-decoration: none; color: inherit; }
ul { list-style: none; }
img { max-width: 100%; display: block; }

/* ========================================
   TYPOGRAPHY
   ======================================== */
.font-editorial { font-family: 'Merriweather', Georgia, serif; }
.font-sans { font-family: 'Inter', -apple-system, sans-serif; }

.text-editorial-kicker {
  font-family: 'Inter', sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.25em;
  color: hsl(var(--secondary));
}

.text-editorial-headline {
  font-family: 'Merriweather', Georgia, serif;
  font-size: 1.875rem;
  font-weight: 700;
  line-height: 1.15;
  color: hsl(var(--foreground));
}
@media (min-width: 768px) { .text-editorial-headline { font-size: 3rem; } }
@media (min-width: 1024px) { .text-editorial-headline { font-size: 3.75rem; } }

.text-editorial-body {
  font-family: 'Inter', sans-serif;
  font-size: 1rem;
  line-height: 1.75;
  color: hsl(var(--muted-foreground));
}
@media (min-width: 768px) { .text-editorial-body { font-size: 1.125rem; } }

/* ========================================
   LAYOUT
   ======================================== */
.editorial-container { max-width: 80rem; margin: 0 auto; }

.section-padding { padding: 4rem 1.5rem; }
@media (min-width: 768px) { .section-padding { padding: 6rem 3rem; } }
@media (min-width: 1024px) { .section-padding { padding: 6rem 5rem; } }

.editorial-divider { width: 4rem; height: 2px; background: hsl(var(--secondary)); }

/* ========================================
   GRIDS
   ======================================== */
.grid-stories { display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
@media (min-width: 768px) { .grid-stories { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .grid-stories { grid-template-columns: repeat(3, 1fr); } }

.grid-counters { display: grid; gap: 2rem; grid-template-columns: repeat(2, 1fr); }
@media (min-width: 1024px) { .grid-counters { grid-template-columns: repeat(4, 1fr); gap: 1.5rem; } }

.grid-infra { display: grid; gap: 1.25rem; grid-template-columns: 1fr; }
@media (min-width: 768px) { .grid-infra { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .grid-infra { grid-template-columns: repeat(3, 1fr); } }

.grid-raiox { display: grid; gap: 2rem; grid-template-columns: 1fr; }
@media (min-width: 768px) { .grid-raiox { grid-template-columns: repeat(2, 1fr); } }

.grid-footer { display: grid; gap: 2.5rem; grid-template-columns: 1fr; }
@media (min-width: 768px) { .grid-footer { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .grid-footer { grid-template-columns: repeat(4, 1fr); } }

/* ========================================
   NAVBAR
   ======================================== */
.w3-navbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  transition: all 0.3s;
}
.navbar-solid {
  background: hsla(var(--background) / 0.95);
  backdrop-filter: blur(8px);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}
.navbar-transparent {
  background-color: #00000030;
  backdrop-filter: blur(4px);
}
.w3-navbar-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 56px;
  padding: 0 1.5rem;
}
/* .w3-navbar-logo {
  font-size: 0.875rem;
  font-weight: 700;
  color: hsl(var(--primary-foreground));
}
.navbar-solid .w3-navbar-logo { color: hsl(var(--primary)); } */
.w3-navbar-logo img {
  height: 40px;
}

.w3-navbar-logo .logo-solid { display: none; }
.navbar-solid .w3-navbar-logo .logo-default { display: none; }
.navbar-solid .w3-navbar-logo .logo-solid { display: inline; }

.w3-nav-links { display: flex; gap: 1.5rem; }
@media (max-width: 767px) { .w3-nav-links { display: none; } }
.w3-nav-link {
  font-size: 0.75rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: hsl(var(--primary-foreground));
  transition: color 0.3s;
}
.navbar-solid .w3-nav-link { color: hsl(var(--foreground)); }
.w3-social-icons {
  display: none;
  align-items: center;
  gap: 0.5rem;
}
@media (min-width: 768px) { .w3-social-icons { display: flex; } }
.w3-social-link {
  color: hsl(var(--primary-foreground) / 0.7);
  transition: color 0.3s;
}
.w3-social-link:hover { color: hsl(var(--secondary)); }
.navbar-solid .w3-social-link { color: hsl(var(--muted-foreground)); }
.navbar-solid .w3-social-link:hover { color: hsl(var(--secondary)); }
.w3-social-svg {
  width: 1rem;
  height: 1rem;
  fill: currentColor;
}
.w3-menu-toggle {
  display: none;
  background: none;
  border: none;
  color: hsl(var(--primary-foreground));
  cursor: pointer;
  font-size: 1.5rem;
}
@media (max-width: 767px) { .w3-menu-toggle { display: block; } }
.navbar-solid .w3-menu-toggle { color: hsl(var(--foreground)); }
.w3-mobile-menu {
  background: hsla(var(--background) / 0.95);
  backdrop-filter: blur(8px);
  padding: 1rem 1.5rem;
}
.w3-mobile-link {
  display: block;
  padding: 0.5rem 0;
  color: hsl(var(--foreground));
}

/* ========================================
   HERO
   ======================================== */
.w3-hero {
  position: relative;
  height: 100vh;
  width: 100%;
  overflow: hidden;
}
.w3-hero-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
}
.w3-hero-overlay {
  position: absolute;
  inset: 0;
  /* background: linear-gradient(to top, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.2), transparent); */
  background: linear-gradient(to top, rgba(0, 0, 0, 0.75) 0%, rgba(0, 0, 0, 0.6) 55%, transparent 65%, transparent)
}
.w3-hero-content {
  position: relative;
  z-index: 10;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 0 1.5rem 7rem;
}
@media (min-width: 768px) { .w3-hero-content { padding-bottom: 7rem; } }
.w3-hero-kicker {
  margin-bottom: 1rem;
  color: hsla(var(--primary-foreground) / 0.8);
  letter-spacing: 0.3em;
}
.w3-hero-title {
  font-size: clamp(4rem, 12vw, 10rem);
  font-weight: 700;
  color: hsl(var(--secondary));
  line-height: 0.9;
  margin-bottom: 1rem;
}
.w3-hero-subtitle {
  font-size: clamp(1.5rem, 3vw, 2.5rem);
  font-style: italic;
  color: hsla(var(--primary-foreground) / 0.9);
  margin-bottom: 1.5rem;
  max-width: 40rem;
}
.w3-hero-desc {
  font-size: 1rem;
  color: hsla(var(--primary-foreground) / 0.75);
  max-width: 32rem;
  line-height: 1.75;
}
.w3-scroll-indicator {
  position: absolute;
  bottom: 2rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  color: hsla(var(--primary-foreground) / 0.6);
  font-size: 2rem;
}

/* ========================================
   CARDS
   ======================================== */
.card-editorial {
  display: block;
  background: hsl(var(--background));
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  transition: box-shadow 0.3s;
}
.card-editorial:hover { box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1); }

.w3-card-thumb {
  position: relative;
  height: 13rem;
  overflow: hidden;
  background: hsl(var(--muted));
}
.w3-card-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.w3-card-badge {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  background: hsl(var(--secondary));
  color: hsl(var(--secondary-foreground));
  font-size: 0.625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  padding: 0.25rem 0.5rem;
  border-radius: 2px;
}
.w3-card-body { padding: 1.25rem; }
.w3-card-title {
  font-size: 1.125rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
}
.w3-card-summary {
  font-size: 0.875rem;
  color: hsl(var(--muted-foreground));
  line-height: 1.6;
  margin-bottom: 1rem;
}
.w3-card-readmore {
  font-size: 0.75rem;
  font-weight: 600;
  color: hsl(var(--secondary));
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
.w3-btn-outline {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: hsl(var(--primary));
  border: 1px solid hsl(var(--primary));
  padding: 0.75rem 1.5rem;
  border-radius: var(--radius);
  transition: all 0.3s;
}
.w3-btn-outline:hover {
  background: hsl(var(--primary));
  color: hsl(var(--primary-foreground));
  cursor: pointer;
}

/* ========================================
   VOZES / MAPA COM PINS
   ======================================== */
.w3-section-dark {
  background: hsl(var(--editorial-dark));
  position: relative;
  overflow: hidden;
}
.w3-section-dark-bg {
  position: absolute;
  inset: 0;
  opacity: 0.2;
  background-size: cover;
  background-position: center;
  filter: grayscale(100%);
}
.w3-section-dark-content { position: relative; z-index: 10; }
.w3-dark-headline {
  font-size: clamp(1.875rem, 5vw, 3rem);
  font-weight: 700;
  color: hsl(var(--primary-foreground));
  margin-bottom: 1rem;
}
.w3-map-container {
  position: relative;
  width: 100%;
  aspect-ratio: 2 / 1;
  border-radius: 0.5rem;
}
.w3-map-img-wrap {
  position: absolute;
  inset: 0;
  border-radius: 0.5rem;
  overflow: hidden;
}
.w3-map-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 1;
  filter: grayscale(100%);
}
.w3-pin {
  position: absolute;
  z-index: 10;
}
.w3-pin-dot {
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
}
@media (max-width: 767px) {
  .w3-pin-dot { width: 0.6rem; height: 0.6rem; }
}
.w3-pin-tooltip {
  position: absolute;
  bottom: 1.75rem;
  left: 50%;
  transform: translateX(-50%);
  width: 16rem;
  padding: 1rem;
  border-radius: var(--radius);
  background: hsl(var(--background));
  color: hsl(var(--foreground));
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
  z-index: 60;
}
.w3-pin-quote {
  font-size: 0.875rem;
  font-style: italic;
  line-height: 1.6;
  margin-bottom: 0.5rem;
}
.w3-pin-author {
  font-size: 0.75rem;
  color: hsl(var(--muted-foreground));
  font-weight: 500;
}

/* Pin colors */
.pin-sul { background: hsl(var(--secondary)); }
.pin-norte { background: hsl(var(--primary)); }

/* Legend */
.w3-legend { display: flex; gap: 1.5rem; margin-top: 1.5rem; }
.w3-legend-item { display: flex; align-items: center; gap: 0.5rem; }
.w3-legend-dot { width: 0.75rem; height: 0.75rem; border-radius: 50%; }
.w3-legend-label {
  font-size: 0.75rem;
  color: hsla(var(--primary-foreground) / 0.6);
}

/* ========================================
   INFRAESTRUTURA (EXPANDABLE CARDS)
   ======================================== */
.w3-section-muted { background: hsl(var(--muted)); }

.w3-expand-card {
  background: hsl(var(--background));
  border-radius: var(--radius);
  padding: 1.5rem;
  cursor: pointer;
  border-color: transparent;
  border-style: solid;
  border-width: 2px;
  transition: all 0.3s;

}
.w3-expand-card.expanded {
  transition: all 0.5s !important;
  box-shadow: 0 0 1px 2px hsl(var(--secondary));
}
.w3-expand-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  color: hsl(var(--secondary));
}
.w3-expand-icon { font-size: 2rem; }
.w3-expand-chevron {
  font-size: 1.25rem;
  color: hsl(var(--muted-foreground));
  transition: transform 0.3s;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.expanded .w3-expand-chevron { transform: rotate(180deg); }
.w3-expand-title {
  font-size: 1.125rem;
  font-weight: 700;
  margin: 1rem 0 0.5rem;
}
.w3-expand-summary {
  font-size: 0.875rem;
  color: hsl(var(--muted-foreground));
  line-height: 1.6;
}
.w3-expand-detail {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid hsl(var(--border));
}
.w3-expand-detail p {
  font-size: 0.875rem;
  color: hsl(var(--foreground));
  line-height: 1.6;
}

/* ========================================
   DADOS (COUNTERS)
   ======================================== */
.w3-dados-section { padding: 3rem 1.5rem; background: hsl(var(--muted)); }
.w3-counter-item { text-align: center; }
.counter-number {
  font-family: 'Merriweather', Georgia, serif;
  font-size: 2.5rem;
  font-weight: 700;
  color: hsl(var(--secondary));
}
@media (min-width: 768px) { .counter-number { font-size: 3rem; } }
@media (min-width: 1024px) { .counter-number { font-size: 3.75rem; } }
.w3-counter-unit {
  font-size: 1rem;
  font-weight: 600;
  color: hsl(var(--foreground));
  margin-top: 0.25rem;
}
.counter-label {
  font-family: 'Inter', sans-serif;
  font-size: 0.875rem;
  color: hsl(var(--muted-foreground));
  margin-top: 0.5rem;
  max-width: 200px;
  margin-left: auto;
  margin-right: auto;
}

/* ========================================
   RAIO X
   ======================================== */
.w3-raiox-img-wrap {
  position: relative;
  border-radius: 0.5rem;
  overflow: hidden;
  margin-bottom: 1.5rem;
}
.w3-raiox-img {
  width: 100%;
  height: 18rem;
  object-fit: cover;
}
.w3-raiox-overlay {
  position: absolute;
  inset: 0;
  background: hsla(var(--editorial-dark) / 0.4);
}
.w3-raiox-title {
  font-size: 1.25rem;
  font-weight: 700;
  margin-bottom: 0.75rem;
}

/* ========================================
   VÍDEOS
   ======================================== */
.w3-video-label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: hsl(var(--muted-foreground));
  margin-bottom: 1rem;
}
.w3-scroll-wrap { position: relative; }
.w3-scroll-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 20;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background: hsla(var(--background) / 0.8);
  border: 1px solid hsl(var(--border));
  cursor: pointer;
  font-size: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.w3-scroll-btn--left { left: -1rem; }
.w3-scroll-btn--right { right: -1rem; }

.flex-scroll {
  display: flex;
  gap: 1.25rem;
  overflow-x: auto;
  scroll-behavior: smooth;
  overflow-y: clip;
  padding-bottom: 2rem;
  scroll-snap-type:x proximity; /* ou mandatory*/
  -webkit-overflow-scrolling:touch;
}
.flex-scroll > * { 
  flex-shrink: 0;
  scroll-snap-align:start;
}
.scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }
.scrollbar-hide::-webkit-scrollbar { display: none; }

/* Video card (horizontal 16:9) */
.w3-video-card { width: 80vw; max-width: 22rem; cursor: pointer; }
.w3-video-thumb { position: relative; aspect-ratio: 16 / 9; overflow: hidden; }
.w3-video-thumb img { width: 100%; height: 100%; object-fit: cover; }
.w3-video-play-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.3);
  display: flex;
  align-items: center;
  justify-content: center;
}
.w3-play-btn {
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 50%;
  background: hsl(var(--secondary));
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
  color: hsl(var(--secondary-foreground));
}
.w3-play-icon {
  color: hsl(var(--secondary-foreground));
  font-size: 1.25rem;
  margin-left: 3px;
}
.w3-video-badge {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  background: hsl(var(--primary));
  color: hsl(var(--primary-foreground));
  font-size: 0.625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  padding: 0.25rem 0.5rem;
  border-radius: 2px;
}
.w3-video-badge--accent {
  background: hsl(var(--secondary));
  color: hsl(var(--secondary-foreground));
}
.w3-video-info { padding: 1rem; }
.w3-video-title { font-size: 0.875rem; font-weight: 700; }

/* Vertical video card (9:16) */
.w3-video-card--vertical { width: 40vw; max-width: 10rem; cursor: pointer; }
.w3-video-thumb--vertical { position: relative; aspect-ratio: 9 / 16; overflow: hidden; }
.w3-video-thumb--vertical img {height: 100%; object-fit: cover; object-position: center;}
.w3-play-btn--sm {
  width: 2.5rem;
  height: 2.5rem;
}
.w3-play-icon--sm { font-size: 1rem; margin-left: 2px; }
.w3-video-badge--vertical {
  position: absolute;
  top: 0.5rem;
  left: 0.5rem;
  font-size: 0.5625rem;
  padding: 0.125rem 0.375rem;
}
.w3-video-gradient-bottom {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
  padding: 0.75rem;
}
.w3-video-gradient-title {
  font-size: 0.75rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.3;
}

/* ========================================
   MAPA INTERATIVO
   ======================================== */
.w3-iframe-wrap {
  position: relative;
  width: 100%;
  min-height: 500px;
  border-radius: 0.5rem;
  overflow: hidden;
  background: hsl(var(--background));
}
.w3-iframe-wrap iframe {
  width: 100%;
  height: 600px;
  border: none;
}

/* ========================================
   FOOTER
   ======================================== */
.w3-footer {
  background: hsl(var(--primary));
  color: hsl(var(--primary-foreground));
  padding: 4rem 1.5rem;
}
.w3-footer-title {
  font-size: 1.125rem;
  font-weight: 700;
  margin-bottom: 1rem;
}
.w3-footer-desc {
  font-size: 0.875rem;
  color: hsla(var(--primary-foreground) / 0.7);
  line-height: 1.75;
}
.w3-footer-heading {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: hsl(var(--secondary));
  margin-bottom: 1rem;
}
.w3-footer-list {
  font-size: 0.875rem;
  color: hsla(var(--primary-foreground) / 0.7);
}
.w3-footer-list li { margin-bottom: 0.25rem; }
.w3-footer-bottom {
  border-top: 1px solid hsla(var(--primary-foreground) / 0.2);
  padding-top: 1.5rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 1rem;
}
.w3-footer-copy {
  font-size: 0.75rem;
  color: hsla(var(--primary-foreground) / 0.5);
}

/* ========================================
   UTILITIES
   ======================================== */
.mb-3 { margin-bottom: 0.75rem; }
.mb-4 { margin-bottom: 1rem; }
.mb-6 { margin-bottom: 1.5rem; }
.mb-12 { margin-bottom: 3rem; }
.mt-10 { margin-top: 2.5rem; }
.mx-auto { margin-left: auto; margin-right: auto; }
.text-center { text-align: center; }
.block { display: block; }
.relative { position: relative; }

/* ========================================
   ANIMATIONS
   ======================================== */
@keyframes pinBounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}
.animate-pin-bounce { animation: pinBounce 2s ease-in-out infinite; }

@keyframes scrollBounce {
  0%, 100% { transform: translateY(0); opacity: 0.6; }
  50% { transform: translateY(10px); opacity: 1; }
}
.animate-scroll-bounce { animation: scrollBounce 2s ease-in-out infinite; }

/* sobreposições ao style da interna */
.cb-main-warp .bg-image {
  justify-content: flex-end;
}