/* Ajustes finais: Montserrat em todo o site e contraste correto nas secoes escuras */
html, body, #app, #igreen-global-nav {
  font-family: "Montserrat", sans-serif !important;
}
#app *:not(i):not(svg):not(path):not(.mdi):not([class*="mdi-"]):not([class*="fa-"]):not(.material-icons):not([class*="material-icons"]) {
  font-family: "Montserrat", sans-serif !important;
}
#app h1, #app h2, #app h3, #app h4, #app h5, #app h6,
#app h1 *, #app h2 *, #app h3 *, #app h4 *, #app h5 *, #app h6 * {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 600 !important;
}
#igreen-global-nav, #igreen-global-nav * {
  font-family: "Montserrat", sans-serif !important;
}

/* Hero Mobi: manter texto branco e destaque verde */
#app .igreen-mobi-added .hero { color: #fff !important; }
#app .igreen-mobi-added .hero h1,
#app .igreen-mobi-added .hero p { color: #fff !important; }
#app .igreen-mobi-added .hero h1 .green { color: #18ff00 !important; }
#app .igreen-mobi-added .hero-actions .primary { color: #078b42 !important; }
#app .igreen-mobi-added .hero-actions .secondary { color: #fff !important; }

/* Modelos e comparativo: corrigir titulos e textos que estavam pretos sobre fundo escuro */
#app .igreen-mobi-added .models,
#app .igreen-mobi-added .model-comparison { color: #edf5ef !important; }
#app .igreen-mobi-added .models .models-title,
#app .igreen-mobi-added .models .model-card h3,
#app .igreen-mobi-added .model-comparison h3 { color: #f4f8f5 !important; }
#app .igreen-mobi-added .models .models-intro { color: #b8c4bb !important; }
#app .igreen-mobi-added .models .models-intro strong { color: #f0f5f1 !important; }
#app .igreen-mobi-added .models .model-meta { color: #d2dbd4 !important; }
#app .igreen-mobi-added .models .model-power { color: #dce5de !important; }
#app .igreen-mobi-added .models .model-price-box { color: #e8f0ea !important; }
#app .igreen-mobi-added .models .model-price-main { color: #f4faf5 !important; }
#app .igreen-mobi-added .models .model-price-detail { color: #b2beb5 !important; }
#app .igreen-mobi-added .models .model-price-detail strong { color: #e8f4eb !important; }
#app .igreen-mobi-added .model-comparison-head p { color: #aab6ad !important; }
#app .igreen-mobi-added .model-comparison-table thead th { color: #eaf1eb !important; }
#app .igreen-mobi-added .model-comparison-table thead th:first-child { color: #aab6ad !important; }
#app .igreen-mobi-added .model-comparison-table thead th.comparison-featured { color: #00ed40 !important; }
#app .igreen-mobi-added .model-comparison-table tbody th,
#app .igreen-mobi-added .model-comparison-table tbody td { color: #c1cbc3 !important; }
#app .igreen-mobi-added .model-comparison-table tbody th { color: #a6b2a9 !important; }
#app .igreen-mobi-added .model-comparison-table tbody tr:nth-child(4) td { color: #00ed40 !important; }
#app .igreen-mobi-added .model-comparison-note,
#app .igreen-mobi-added .models-launch { color: #9aa69d !important; }
#app .igreen-mobi-added .model-label { color: #c4cec6 !important; }
#app .igreen-mobi-added .model-label-featured { color: #001b08 !important; }
#app .igreen-mobi-added .model-button,
#app .igreen-mobi-added .models .model-button { color: #001707 !important; }

/* Fluxo de pagamento: reforcar contraste branco/cinza em todo o bloco escuro */
#app .igreen-mobi-added .payment-flow { color: #edf5ef !important; }
#app .igreen-mobi-added .payment-flow-copy h2,
#app .igreen-mobi-added .payment-flow-panel h3 { color: #f4f8f5 !important; }
#app .igreen-mobi-added .payment-flow-copy h2 em { color: #17d95a !important; }
#app .igreen-mobi-added .payment-flow-lead { color: #c1cbc4 !important; }
#app .igreen-mobi-added .payment-benefits li { color: #d1dbd3 !important; }
#app .igreen-mobi-added .payment-benefits li strong { color: #f0f5f1 !important; }
#app .igreen-mobi-added .payment-flow-panel-head p { color: #b4c0b7 !important; }
#app .igreen-mobi-added .payment-step-copy strong { color: #eef5ef !important; }
#app .igreen-mobi-added .payment-step-copy span { color: #b3beb6 !important; }
#app .igreen-mobi-added .payment-step-value { color: #25e76a !important; }
#app .igreen-mobi-added .payment-ultra-note { color: #c0cbc2 !important; }
#app .igreen-mobi-added .payment-ultra-note strong { color: #24e86a !important; }
#app .igreen-mobi-added .payment-flow-cta { color: #fff !important; }


/* Ajuste de espacamento no inicio da Conexao Mobi */
#app .igreen-mobi-added .hero {
  min-height: 0 !important;
  padding: 38px 0 46px !important;
  align-items: flex-start !important;
}
#app .igreen-mobi-added .hero .container {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
#app .igreen-mobi-added .hero h1 {
  font-size: clamp(37px, 3.15vw, 45px) !important;
  line-height: 1.13 !important;
  letter-spacing: -1.1px !important;
  margin-bottom: 18px !important;
}

@media (min-width: 768px) and (max-width: 1024px) {
  #app .igreen-mobi-added .hero {
    padding: 30px 0 38px !important;
  }
  #app .igreen-mobi-added .hero .container {
    padding-top: 0 !important;
  }
  #app .igreen-mobi-added .hero h1 {
    font-size: clamp(34px, 4vw, 40px) !important;
  }
}

@media (max-width: 767px) {
  #app .igreen-mobi-added .hero {
    padding: 22px 0 30px !important;
  }
  #app .igreen-mobi-added .hero .container {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  #app .igreen-mobi-added .hero h1 {
    font-size: 30px !important;
    line-height: 1.13 !important;
    letter-spacing: -.65px !important;
    margin-bottom: 12px !important;
  }
}

/* Rodape original: ampliar a altura e manter todo o conteudo dentro do painel */
#app [element="PanelComponent"][id="9675909878"] {
  height: 155px !important;
  min-height: 155px !important;
  overflow: visible !important;
}
#app [element="PanelComponent"][id="9675909878"] .panel-body {
  height: 100% !important;
  overflow: visible !important;
}

@media (max-width: 767px) {
  #app [element="PanelComponent"][id="9675909878"] {
    height: auto !important;
    min-height: 0 !important;
    padding: 16px 12px 18px !important;
  }
  #app [element="PanelComponent"][id="9675909878"] .panel-body {
    height: auto !important;
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
  }
  #app [element="PanelComponent"][id="9675909878"] .sitebuilder-element-container {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
    padding: 0 !important;
    text-align: center !important;
  }
  #app [element="PanelComponent"][id="9675909878"] #1653689232961 {
    width: 88px !important;
    max-width: 88px !important;
    margin: 0 auto 4px !important;
  }
  #app [element="PanelComponent"][id="9675909878"] #1653689232961 img {
    display: block !important;
    width: 88px !important;
    max-width: 88px !important;
    height: auto !important;
    margin: 0 auto !important;
  }
  #app [element="PanelComponent"][id="9675909878"] #1653675932348,
  #app [element="PanelComponent"][id="9675909878"] #1658770756723 {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    padding: 3px 10px !important;
    text-align: center !important;
  }
  #app [element="PanelComponent"][id="9675909878"] #1653675932348 h1,
  #app [element="PanelComponent"][id="9675909878"] #1658770756723 p {
    text-align: center !important;
    margin: 0 !important;
  }
}

/* Correcao definitiva: a logo da Conexao Mobi ocupa seu proprio espaco no fluxo,
   evitando que a headline fique sobreposta em desktop, tablet ou celular. */
#app .igreen-mobi-added .hero-logo {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  display: block !important;
  width: 158px !important;
  max-width: 42vw !important;
  height: auto !important;
  margin: 0 0 22px 0 !important;
  transform: none !important;
  z-index: 3 !important;
}
#app .igreen-mobi-added .hero-grid {
  position: relative !important;
  min-width: 0 !important;
}
#app .igreen-mobi-added .hero h1,
#app .igreen-mobi-added .hero p,
#app .igreen-mobi-added .hero-art {
  min-width: 0 !important;
  max-width: 100% !important;
}

@media (min-width: 768px) and (max-width: 1024px) {
  #app .igreen-mobi-added .hero-logo {
    width: 142px !important;
    margin-bottom: 16px !important;
  }
}

@media (max-width: 767px) {
  #app .igreen-mobi-added .hero-logo {
    width: 112px !important;
    max-width: 42vw !important;
    margin: 0 0 15px 0 !important;
  }
  #app .igreen-mobi-added .hero-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-areas: "kicker" "title" "desc" "art" "actions" !important;
    gap: 0 !important;
  }
}

/* Ajuste do espacamento do primeiro bloco Green (somente desktop).
   Aproxima a headline do menu e reposiciona os demais elementos mantendo o fluxo. */
@media (min-width: 761px) {
  #app [element="PanelComponent"][id="9762876389"] {
    height: 885px !important;
    min-height: 885px !important;
  }
  #app [element="TextComponent"][id="1657066566704"] {
    top: 53px !important;
  }
  #app [element="TextComponent"][id="1653676314891"] {
    top: 280px !important;
  }
  #app [element="WistiaVideoComponent"][id="1658775420620"] {
    top: 360px !important;
  }
  #app [element="ButtonComponent"][id="1653675932326"] {
    top: 776px !important;
  }
}