/* ============================================================================
   Menu mobile (hambúrguer) do redesign — injetado por js/redesign-nav.js.
   Só aparece em telas pequenas; no desktop a nav normal continua igual.
   ============================================================================ */
.rnav-burger{display:none}

@media(max-width:860px){
  .rnav-burger{
    display:flex;flex-direction:column;justify-content:center;gap:9px;
    position:absolute;left:18px;top:50%;transform:translateY(-50%);
    width:44px;height:44px;padding:0;background:transparent;border:0;cursor:pointer;z-index:61;
  }
  .rnav-burger span{display:block;height:2px;width:32px;background:#fff;border-radius:2px;transition:transform .3s,opacity .3s;margin:0 auto}
  .rnav-burger.open span:nth-child(1){transform:translateY(11px) rotate(45deg)}
  .rnav-burger.open span:nth-child(2){opacity:0}
  .rnav-burger.open span:nth-child(3){transform:translateY(-11px) rotate(-45deg)}
  /* Lupa à direita no mobile: o container volta a existir só para conter a
     busca, que é posicionada de forma absoluta. Mas ele não pode OCUPAR
     espaço: como irmão flex da logo, empurrava ela 85px para a esquerda do
     centro. Largura zero resolve — a lupa aparece, o fluxo não sente. */
  header#hd .nav .right{display:block;flex:0 0 0;width:0;min-width:0}
  /* O mesmo vale para o lado esquerdo. Algumas páginas escondem o container
     inteiro no mobile e outras escondem só os links dentro dele; nas segundas,
     o container vazio continuava esticando (flex:1) e jogava a logo para a
     direita. Com os dois lados em largura zero, a logo cai no centro em
     qualquer página. */
  header#hd .nav .left{flex:0 0 0;width:0;min-width:0}
  header#hd .nav .right a.link{display:none}
  header#hd .nav .search{display:flex;align-items:center;justify-content:center;width:54px;height:54px;right:8px;top:50%;transform:translateY(-50%);font-size:40px;opacity:.9;cursor:pointer}
}

/* fundo escuro */
.rnav-overlay{position:fixed;inset:0;background:rgba(8,20,32,.55);opacity:0;visibility:hidden;transition:.3s;z-index:70}
.rnav-overlay.open{opacity:1;visibility:visible}

/* gaveta lateral */
.rnav-drawer{
  position:fixed;top:0;left:0;bottom:0;width:min(82vw,320px);
  background:#34363a;z-index:71;transform:translateX(-100%);
  transition:transform .32s cubic-bezier(.4,0,.2,1);
  display:flex;flex-direction:column;padding:24px 26px 30px;
  box-shadow:16px 0 44px rgba(0,0,0,.32);overflow-y:auto;
}
.rnav-drawer.open{transform:translateX(0)}
.rnav-drawer .rnav-close{align-self:flex-end;background:transparent;border:0;color:#fff;font-size:30px;line-height:1;cursor:pointer;padding:0 4px;margin-bottom:14px}
.rnav-drawer a{
  color:#eaf1f8;font-family:'Jost','Helvetica Neue',Arial,sans-serif;
  font-size:15px;letter-spacing:.18em;text-transform:uppercase;font-weight:400;
  padding:17px 4px;border-bottom:1px solid rgba(255,255,255,.1);text-decoration:none;transition:color .2s
}
.rnav-drawer a:hover,.rnav-drawer a.active{color:#ffd100}
.rnav-drawer .rnav-foot{margin-top:auto;padding-top:22px;color:rgba(255,255,255,.6);font-size:13px;letter-spacing:.04em}
.rnav-drawer .rnav-foot b{color:#fff;font-weight:500}

/* ============================================================================
   Rodapé no MOBILE: links empilhados na vertical (estilo referência FG) e a
   logo em seguida (embaixo da lista). No desktop o rodapé continua igual.
   ============================================================================ */
@media(max-width:860px){
  footer .foot-top{flex-direction:column-reverse;align-items:flex-start;gap:30px}
  footer .foot-top nav{display:flex;flex-direction:column;gap:20px;width:100%}
  footer .foot-top nav a{margin-left:0}
  footer .foot-top img{height:54px;align-self:center}
  footer .copy{text-align:center}
}

/* ============================================================================
   Newsletter no MOBILE: campo em cima e botão embaixo (arranjo da referência).
   Textos e cores continuam iguais — muda só a posição dos elementos.
   ============================================================================ */
@media(max-width:860px){
  .newsletter form{flex-direction:column;border:0;gap:16px;max-width:380px}
  .newsletter input{flex:none;width:100%;border-bottom:1px solid rgba(255,255,255,.45);padding:14px 2px}
  .newsletter button{width:100%;padding:15px 20px}
}

/* ============================================================================
   Painel de BUSCA — aberto pela lupa, desliza da direita para a esquerda.
   ============================================================================ */
.rsearch{
  position:fixed;inset:0;z-index:80;
  background:rgba(12,27,42,.80);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);
  transform:translateX(100%);transition:transform .34s cubic-bezier(.4,0,.2,1);
  padding:24px 22px;
}
.rsearch.open{transform:translateX(0)}
.rsearch-close{position:absolute;top:18px;right:20px;background:transparent;border:0;color:#fff;
  font-size:34px;line-height:1;cursor:pointer;width:46px;height:46px;display:flex;align-items:center;justify-content:center}
.rsearch-form{display:flex;align-items:center;gap:14px;max-width:760px;margin:78px auto 0;
  border-bottom:1px solid rgba(255,255,255,.55);padding-bottom:12px}
.rsearch-ic{color:rgba(255,255,255,.8);font-size:22px;line-height:1}
.rsearch-form input{flex:1;background:transparent;border:0;outline:none;color:#fff;
  font-family:'Jost','Helvetica Neue',Arial,sans-serif;font-size:19px;letter-spacing:.02em;padding:6px 2px}
.rsearch-form input::placeholder{color:rgba(255,255,255,.6)}