/**
 * ==========================================================================
 * UNI ICD — ADAPTADOR LUMINOSO EDITORIAL COMPLETO (v0.1-rc2)
 * Atmosfera: Academia Soberana · Formação Contínua · Luz Integral em Toda a Extensão
 * Correção rc2: Iluminação de todas as seções (Hero, Metodologia, Ecossistema, 
 * Metanoia, FAQ, Navegação), eliminação de Cormorant Garamond e contenção de escopo
 * ==========================================================================
 */

/* Importa Tokens Fundacionais */
@import url('tokens.css');

:root {
  --color-obsidian: var(--icd-surface-canvas) !important;
  --color-obsidian-light: var(--icd-surface-canvas-sub) !important;
  --color-white: var(--icd-surface-card) !important;
  --color-gold: var(--icd-accent-gold) !important;
  --color-red-germany: var(--icd-accent-wine) !important;
  --color-terracotta: var(--icd-accent-terracotta) !important;
  
  --font-title: var(--icd-font-title) !important;
  --font-subtitle: var(--icd-font-title) !important;
  --font-body: var(--icd-font-body) !important;
}

/* ─── 1. ESCOPO GERAL DA PÁGINA UNI ICD (ZERO CONTAMINAÇÃO DE HEADER/FOOTER) ─── */
body, #root, .home-container, .main-content {
  background-color: var(--icd-surface-canvas) !important;
  color: var(--icd-ink-body) !important;
  font-family: var(--icd-font-body) !important;
}

/* ─── 2. HERO MONUMENTAL LUMINOSO ─── */
.hero-section {
  background-color: var(--icd-surface-canvas) !important;
  background-image: 
    radial-gradient(ellipse at 70% 30%, hsla(38, 70%, 48%, 0.08) 0%, transparent 60%),
    radial-gradient(ellipse at 20% 80%, hsla(22, 65%, 44%, 0.05) 0%, transparent 50%) !important;
  padding: 100px 48px 80px !important;
}

.hero-section::before {
  background: linear-gradient(90deg, transparent, var(--icd-accent-gold), var(--icd-accent-terracotta), var(--icd-accent-gold), transparent) !important;
  height: 2px !important;
}

.hero-section::after, .hero-atmosphere-low, .hero-overlay-icon-gradient {
  display: none !important;
}

.hero-title {
  font-family: var(--icd-font-title) !important;
  font-size: var(--icd-size-h1) !important;
  font-weight: 600 !important;
  color: var(--icd-ink-headline) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.02em !important;
  margin-bottom: 24px !important;
}

.hero-subtitle {
  font-family: var(--icd-font-lead) !important;
  font-size: var(--icd-size-lead) !important;
  font-weight: 500 !important;
  color: var(--icd-ink-muted) !important;
  line-height: var(--icd-lh-lead) !important;
  margin-bottom: 36px !important;
}

/* CTAs Hero */
.cta-button {
  background: var(--icd-accent-wine) !important;
  color: hsl(0, 0%, 100%) !important;
  font-family: var(--icd-font-title) !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  letter-spacing: 1.5px !important;
  padding: 16px 36px !important;
  border-radius: var(--icd-radius-sm) !important;
  box-shadow: 0 4px 16px hsla(350, 48%, 30%, 0.20) !important;
  transition: var(--icd-transition-fast) !important;
  text-decoration: none !important;
}

.cta-button:hover {
  background: var(--icd-accent-wine-hover) !important;
  transform: translateY(-2px) !important;
}

.cta-button-outlined {
  background: var(--icd-surface-card) !important;
  color: var(--icd-ink-headline) !important;
  border: 1px solid var(--icd-border-subtle) !important;
  font-family: var(--icd-font-title) !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  letter-spacing: 1.5px !important;
  padding: 16px 32px !important;
  border-radius: var(--icd-radius-sm) !important;
  box-shadow: var(--icd-shadow-subtle) !important;
  transition: var(--icd-transition-fast) !important;
  text-decoration: none !important;
}

.cta-button-outlined:hover {
  border-color: var(--icd-accent-gold) !important;
  color: var(--icd-accent-gold-deep) !important;
  background: hsl(0, 0%, 100%) !important;
  transform: translateY(-2px) !important;
}

/* ─── 3. SEÇÃO METODOLOGIA: A ENGENHARIA DA CONVERGÊNCIA ─── */
.methodology-container {
  background-color: var(--icd-surface-canvas-sub) !important;
  border-top: 1px solid var(--icd-border-hairline) !important;
  border-bottom: 1px solid var(--icd-border-hairline) !important;
  padding: 80px 24px !important;
}

.methodology-title, .phase-title {
  font-family: var(--icd-font-title) !important;
  font-size: var(--icd-size-h2) !important;
  font-weight: 600 !important;
  color: var(--icd-ink-headline) !important;
  line-height: var(--icd-lh-heading) !important;
}

.methodology-divider {
  color: var(--icd-accent-gold) !important;
}

.divider-line {
  background-color: var(--icd-accent-gold) !important;
}

.sphere-label {
  font-family: var(--icd-font-title) !important;
  color: var(--icd-ink-muted) !important;
}

.sphere-label.active {
  color: var(--icd-accent-terracotta) !important;
}

.methodology-card, .phase-card, .method-card {
  background-color: var(--icd-surface-card) !important;
  border: 1px solid var(--icd-border-hairline) !important;
  box-shadow: var(--icd-shadow-card) !important;
  border-radius: var(--icd-radius-md) !important;
  color: var(--icd-ink-body) !important;
}

.methodology-card:hover, .phase-card:hover {
  border-color: var(--icd-border-gold) !important;
  box-shadow: var(--icd-shadow-elevated) !important;
}

/* ─── 4. SEÇÃO ECOSSISTEMA DE CONTEÚDO & NAVEGAÇÃO ─── */
.ecosystem-container {
  background-color: var(--icd-surface-canvas) !important;
  padding: 80px 24px !important;
}

.ecosystem-title, .card-title {
  font-family: var(--icd-font-title) !important;
  font-size: var(--icd-size-h2) !important;
  font-weight: 600 !important;
  color: var(--icd-ink-headline) !important;
}

.ecosystem-subtitle {
  font-family: var(--icd-font-lead) !important;
  font-size: var(--icd-size-lead) !important;
  color: var(--icd-ink-muted) !important;
}

.level-tabs {
  border-bottom: 1px solid var(--icd-border-hairline) !important;
}

.level-tab {
  font-family: var(--icd-font-title) !important;
  color: var(--icd-ink-muted) !important;
}

.level-tab:hover {
  color: var(--icd-ink-headline) !important;
}

.level-tab.active {
  color: var(--icd-accent-terracotta) !important;
}

.level-tab.active::after {
  background: var(--icd-accent-terracotta) !important;
}

.type-tab {
  background: var(--icd-surface-card) !important;
  border: 1px solid var(--icd-border-hairline) !important;
  color: var(--icd-ink-muted) !important;
  font-family: var(--icd-font-body) !important;
}

.type-tab.active {
  background: var(--icd-accent-terracotta) !important;
  color: hsl(0, 0%, 100%) !important;
}

.ecosystem-card, .camara-asset-card {
  background-color: var(--icd-surface-card) !important;
  border: 1px solid var(--icd-border-hairline) !important;
  box-shadow: var(--icd-shadow-card) !important;
  border-radius: var(--icd-radius-md) !important;
  color: var(--icd-ink-body) !important;
}

.ecosystem-card:hover {
  border-color: var(--icd-border-gold) !important;
  box-shadow: var(--icd-shadow-elevated) !important;
}

/* ─── 5. SOCIAL PROOF (ECOS DO REINO) ─── */
.social-proof-section {
  background-color: var(--icd-surface-canvas-sub) !important;
  border-top: 1px solid var(--icd-border-hairline) !important;
  padding: 80px 24px !important;
}

.section-headline {
  font-family: var(--icd-font-title) !important;
  font-size: var(--icd-size-h2) !important;
  font-weight: 600 !important;
  color: var(--icd-ink-headline) !important;
  line-height: var(--icd-lh-heading) !important;
}

.section-overline {
  font-family: var(--icd-font-body) !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
  color: var(--icd-accent-terracotta) !important;
}

.section-subline {
  font-family: var(--icd-font-body) !important;
  font-size: var(--icd-size-body) !important;
  color: var(--icd-ink-muted) !important;
}

.social-proof-card {
  background-color: var(--icd-surface-card) !important;
  border: 1px solid var(--icd-border-hairline) !important;
  box-shadow: var(--icd-shadow-card) !important;
  border-radius: var(--icd-radius-md) !important;
  color: var(--icd-ink-body) !important;
}

.social-proof-card:hover {
  border-color: var(--icd-border-gold) !important;
  box-shadow: var(--icd-shadow-elevated) !important;
}

.social-proof-text {
  font-family: var(--icd-font-lead) !important;
  font-size: 1.05rem !important;
  color: var(--icd-ink-body) !important;
  font-style: normal !important;
}

.social-proof-name {
  font-family: var(--icd-font-title) !important;
  font-weight: 600 !important;
  color: var(--icd-ink-headline) !important;
}

.social-proof-role {
  font-family: var(--icd-font-body) !important;
  color: var(--icd-accent-terracotta) !important;
  font-weight: 600 !important;
}

/* ─── 6. SEÇÃO FAQ ─── */
.faq-section {
  background-color: var(--icd-surface-canvas) !important;
  padding: 80px 24px !important;
}

.faq-title {
  font-family: var(--icd-font-title) !important;
  font-size: var(--icd-size-h2) !important;
  font-weight: 600 !important;
  color: var(--icd-ink-headline) !important;
}

.faq-item {
  border-bottom: 1px solid var(--icd-border-hairline) !important;
}

.question-text {
  font-family: var(--icd-font-title) !important;
  font-weight: 600 !important;
  font-size: 1.05rem !important;
  color: var(--icd-ink-headline) !important;
}

.faq-question:hover .question-text {
  color: var(--icd-accent-terracotta) !important;
}

.faq-icon {
  color: var(--icd-accent-terracotta) !important;
}

.answer-text {
  font-family: var(--icd-font-body) !important;
  font-size: var(--icd-size-body) !important;
  color: var(--icd-ink-body) !important;
  line-height: var(--icd-lh-body) !important;
}

/* ─── 7. SUPRESSÃO TOTAL DE ELEMENTOS ESCUROS ANTIGOS & LEGADOS ─── */

/* 7.1. Menu Vertical Escuro (GovSidebar & Triggers Legados) */
.gov-sidebar,
.gov-sidebar--open,
.gov-toggle-btn,
.gov-toggle-btn--open,
.gov-instance-label,
.gov-overlay,
.gov-overlay--active,
#gov-sidebar-toggle {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
  position: absolute !important;
  left: -9999px !important;
  top: -9999px !important;
  z-index: -1 !important;
}

/* Neutraliza o deslocamento lateral legado de 72px no body */
body {
  padding-left: 0 !important;
  margin-left: 0 !important;
}

/* 7.2. Rodapé Escuro Legado do React e Seção Escura de Newsletter */
.footer-container,
footer.footer-container,
.newsletter-section,
.newsletter-section.section-gold-line {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

/* 7.3. Menu Flutuante Escuro (FloatingDock) */
.floating-dock {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}