/* ==========================================================================
   OVERRIDES — Pós-Graduação em Engenharia Geotécnica
   Carregado DEPOIS do CSS do GreatPages. Toda customização mora aqui;
   não edite o CSS minificado dentro do index.html.
   ========================================================================== */

:root{
  /* --- Paleta da identidade visual ---
     Verde e laranja foram EXTRAIDOS do avatar.png (os dois tons dominantes
     do arquivo oficial), nao estimados a olho. */
  --fc-green:          #1B352D;   /* verde da marca                        */
  --fc-green-deep:     #0F1D19;   /* verde profundo: overlay e rodape      */
  --fc-green-deep-rgb: 15, 29, 25;/* o mesmo tom, para compor em rgba()    */
  --fc-green-blend:    #15402F;   /* mesmo matiz, saturacao alta (duotone) */
  --fc-orange:         #FF3300;   /* laranja da marca                      */
  --fc-orange-deep:    #DE2C00;   /* laranja escuro p/ texto branco (v 4.3)*/
  --fc-orange-soft:    #FF8F73;   /* laranja claro p/ texto escuro (v 4.1) */
  --fc-gray:           #EDEDED;   /* cinza-claro dos grafismos             */

  /* ------------------------------------------------------------------
     IMAGEM DE FUNDO DO HERO
     Quando a imagem nova estiver pronta: salve em assets/ e troque
     apenas a linha abaixo (comente a primeira, descomente a segunda).
     ------------------------------------------------------------------ */
  --fc-hero-bg: url("hero-bg.webp");   /* 313 KB — versao servida ao visitante */
  /* --fc-hero-bg: url("hero-bg.png"); */  /* 2,8 MB — PNG master, so para conferir qualidade */

  /* Multiplicador global do overlay (secao 2). A modelagem por altura mora
     nas paradas do gradiente; use isto so para ajuste fino do conjunto. */
  --fc-overlay-strength: 1;

  /* Fundo do rodape */
  --fc-footer-bg: var(--fc-green-deep);
}

/* --------------------------------------------------------------------------
   1. Bloco hero — troca da imagem de fundo
   -------------------------------------------------------------------------- */
#b_3635818_1_1787340759906163138{
  background-image: var(--fc-hero-bg);
  /* A arte e 16:9 (1672x941), quase a proporcao do bloco (1434x883).
     No "cover" ela escala por altura e sobra so ~135px de largura, cortados
     igualmente dos dois lados. Centralizada: o ceu no topo e as bancadas na
     base ficam inteiros, sem precisar de ancoragem. */
  background-position: 50% 50%;

  /* DUOTONE VERDE.
     A foto e um por-do-sol quente (laranja/azul). So sobrepor o verde nao
     resolve: o laranja da foto atravessa e o resultado fica marrom.
     'luminosity' mantem so o brilho da foto e toma a cor do background-color
     abaixo — a imagem inteira vira monocromatica no verde da marca. */
  background-color: var(--fc-green-blend);
  background-blend-mode: luminosity;
}

/* --------------------------------------------------------------------------
   2. Overlay verde — modelado a partir da luminancia MEDIDA da foto
   --------------------------------------------------------------------------
   Medicao da hero-bg.webp na coluna central (x 452-962), por faixa de altura:

       0-30%   ceu ................. L 0,52-0,57   <- MUITO claro
       30-40%  solo organico ....... L 0,03
       40-80%  bancadas ............ L 0,12-0,15
       80-100% rocha da base ....... L 0,04-0,06

   O texto vive quase todo no terco superior — justo onde a foto e mais
   clara. O paragrafo laranja (y 227-370) ainda por cima cruza a fronteira
   ceu/solo, ficando com fundo partido.

   Por isso o gradiente e forte no topo e afrouxa na base: escurece o ceu
   (que nao e o assunto) e libera as bancadas (que sao). As paradas abaixo
   foram calculadas para os alvos de contraste WCAG AA:

       topo    a .90 -> fundo L 0,021 -> branco 14,8:1
       25%     a .86 -> fundo L 0,029 -> branco 13,3:1
       42%     a .78 -> fundo L 0,044 -> laranja #FF8A66 4,8:1  (AA)
       55%     a .55 -> fundo L 0,039 -> branco 11,8:1
   -------------------------------------------------------------------------- */
#b_3635818_1_1787340759906163138 .overlay.gpr26{
  /* Multiplicador global de ajuste fino. A modelagem mora nas paradas do
     gradiente, entao mantenha em 1 e mexa nas paradas se precisar. */
  opacity: var(--fc-overlay-strength);
  background: linear-gradient(180deg,
    rgba(var(--fc-green-deep-rgb), 0.90)   0%,
    rgba(var(--fc-green-deep-rgb), 0.86)  25%,
    rgba(var(--fc-green-deep-rgb), 0.78)  42%,
    rgba(var(--fc-green-deep-rgb), 0.55)  55%,
    rgba(var(--fc-green-deep-rgb), 0.50)  75%,
    rgba(var(--fc-green-deep-rgb), 0.88) 100%);
}

/* Em telas pequenas o "cover" mostra so a fatia central (~26% da largura)
   e o texto ocupa quase toda a linha: escurece mais para nao perder
   contraste em nenhum ponto. */
@media (max-width: 800px){
  #b_3635818_1_1787340759906163138 .overlay.gpr26{
    background: linear-gradient(180deg,
      rgba(var(--fc-green-deep-rgb), 0.92)   0%,
      rgba(var(--fc-green-deep-rgb), 0.89)  30%,
      rgba(var(--fc-green-deep-rgb), 0.84)  48%,
      rgba(var(--fc-green-deep-rgb), 0.68)  62%,
      rgba(var(--fc-green-deep-rgb), 0.64)  80%,
      rgba(var(--fc-green-deep-rgb), 0.90) 100%);
  }
}

/* ==========================================================================
   3. LOGO DO CURSO (topo)
   O container é position:absolute com left fixo, então a largura NÃO pode
   mudar (deslocaria o logo do centro). Por isso: background-size contain —
   a arte se encaixa sem distorcer.
   ========================================================================== */
.gpr2 .imagem_fundo{
  background-image: url("logo-geotecnica.webp") !important;   /* 7 KB */
  background-size: contain !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

/* O lockup novo e mais largo que o antigo (4,02 contra 3,53). No mesmo box
   o "contain" o encaixava pela largura e sobrava altura: o logo renderizava
   46px de altura num box de 57px, deixando a linha "POS-GRADUACAO EM"
   pequena demais para ler. Alargamos o box para que ele preencha a altura.

   O "left" original (387px) tambem deixava o box 10px a esquerda do centro
   real do container. Trocamos por calc(50% - metade da largura), que
   centraliza de verdade e nao depende da largura do .center. Usamos left em
   vez de transform de proposito: o elemento tem animacao de entrada, e um
   transform nosso poderia conflitar com ela. */
#e_3635818_1_178734088627951513{
  width: 226px !important;
  left: calc(50% - 113px) !important;
}
@media (max-width: 800px){
  #e_3635818_1_178734088627951513{
    width: 204px !important;
    left: calc(50% - 102px) !important;
  }
}

/* ==========================================================================
   4. ACENTOS  ->  LARANJA
   O tema trazia dois verdes do curso antigo (#3bbb47 e #578019), que numa
   primeira versao viraram dourado. Agora todos os acentos usam o laranja
   da identidade.
   ========================================================================== */

/* 4.1 — Parágrafo de destaque ("Escolher uma pós-graduação é decidir ir além…")
        Texto pequeno sobre fundo escuro: o laranja puro (#FF3C0A) da so
        3,3:1 de contraste. Usamos uma versao clareada, que mantem a familia
        de cor e sobe para ~5:1. */
.gpr9,
.gpr9 *{
  color: var(--fc-orange-soft) !important;
}

/* 4.2 — Pill "Espere, não saia dessa página ainda…"
        Borda e brilho: laranja puro (e borda, nao texto — sem restricao
        de contraste). */
.e_caixa.gpr11{
  border-color: var(--fc-orange) !important;
  filter: drop-shadow(0 0 6px rgba(255, 51, 0, 0.70)) !important;
}

/* 4.3 — Card "Fique de olho na sua caixa de e-mail!"
        Bloco laranja solido, como na referencia da marca.
        NOTA DE CONTRASTE: com o laranja puro, o texto branco fica em
        3,6:1 (abaixo do AA de 4,5:1). Por isso o card usa --fc-orange-deep
        (#D63200), que sobe para 4,9:1 e passa. Se preferir o tom exato da
        referencia, troque para var(--fc-orange) — fica mais vibrante,
        porem menos legivel. */
.e_caixa.gpr18{
  background-color: var(--fc-orange-deep) !important;
  border-color: rgba(255, 255, 255, 0.55) !important;
}

/* 4.4 — Textos dentro do card: branco sobre o laranja */
.gpr21, .gpr21 *,
.gpr24, .gpr24 *{
  color: #FFFFFF !important;
}

/* ==========================================================================
   5. RODAPE
   Substitui o rodape gerado pelo GreatPages (elementos absolutos, dificil
   de estender) por markup proprio: mesma informacao + selo do MEC, logo da
   Anhanguera e o texto institucional da parceria.
   ========================================================================== */
.fc-rodape{
  background: var(--fc-footer-bg);
  padding: 46px 24px 54px;
  font-family: Poppins, sans-serif;
  text-align: center;
}
.fc-rodape__inner{
  max-width: 780px;
  margin: 0 auto;
}

/* Logo FSC */
.fc-rodape__fsc{
  width: 192px; height: auto;
  display: block; margin: 0 auto 22px;
}

/* Razao social / CNPJ */
.fc-rodape__legal{
  margin: 0;
  font-size: 12px; font-weight: 300; line-height: 1.75;
  color: #A8A8A8;
}

/* Selo do MEC + a chancela ao lado */
.fc-rodape__mec{
  display: flex; align-items: center; justify-content: center;
  gap: 12px;
  margin-top: 22px;
}
.fc-rodape__mec img{ width: 46px; height: auto; display: block; }
.fc-rodape__mec span{
  font-size: 11px; font-weight: 400;
  letter-spacing: 2.4px;              /* tracking largo, como na referencia */
  text-transform: uppercase;
  color: #8A968E;                     /* cinza levemente esverdeado */
}

/* Divisoria */
.fc-rodape__linha{
  border: 0; height: 1px;
  background: rgba(255,255,255,0.13);
  margin: 34px auto;
  max-width: 690px;
}

/* Bloco da Anhanguera */
.fc-rodape__anhanguera{
  width: 104px; height: auto;
  display: block; margin: 0 auto 20px;
}
.fc-rodape__parceria{
  margin: 0;
  font-size: 13px; font-weight: 300; line-height: 1.7;
  color: #C6CFC9;                     /* cinza levemente esverdeado */
  text-wrap: pretty;                  /* evita palavra sozinha na ultima linha */
}

@media (max-width: 800px){
  .fc-rodape{ padding: 38px 22px 44px; }
  .fc-rodape__mec{ flex-direction: column; gap: 10px; }
  .fc-rodape__parceria{ font-size: 12.5px; text-align: left; }
  .fc-rodape__linha{ margin: 28px auto; }
}