/* ==========================================================================
   LAYOUT — cabecalho, menu e rodape. Carregado em todas as paginas.

   O cabecalho tem duas versoes:
     .rg-header                  padrao das paginas internas — fundo claro,
                                 texto escuro, ocupa espaco no fluxo.
     .rg-header--sobreposto      Home — transparente sobre o hero, texto branco.
   ========================================================================== */

/* --------------------------------------------------------------------------
   TOPO / HEADER            Figma: faixa 177:7 (y 0, h 16); header sobre o hero
   -------------------------------------------------------------------------- */
.rg-topbar { height: 16px; background: var(--rg-brown); }

/* Paginas internas: header no fluxo, sobre o fundo claro da primeira secao. */
.rg-header { position: relative; z-index: 20; background: var(--rg-cream); }
.rg-header__inner { position: relative; height: 145px; }

/* Home: header transparente sobre a foto do hero. */
.rg-header--sobreposto { position: absolute; inset: 16px 0 auto 0; background: none; }

.rg-header__logo { position: absolute; left: 98px; top: 59px; }  /* y 75 - 16 da faixa */
.rg-header__logo img { width: 256px; height: auto; }

.rg-nav {
  position: absolute; right: 92px; top: 74px;   /* y 90 - 16 */
  display: flex; align-items: center; gap: 48px;
}
.rg-nav ul { margin: 0; padding: 0; list-style: none; }
.rg-nav__list { display: flex; align-items: center; gap: 48px; }
.rg-nav__list > li { position: relative; }
.rg-nav__list > li > a {
  display: inline-block;
  font-size: var(--rg-fs-nav); font-weight: 400; line-height: 1;
  color: var(--rg-teal); letter-spacing: 0.01em;
  padding-bottom: 4px; border-bottom: 1px solid transparent;
}
.rg-header--sobreposto .rg-nav__list > li > a { color: var(--rg-white); }
.rg-nav__list > li > a:hover { border-bottom-color: var(--rg-bronze); }
/* Pagina atual em bronze, como no Figma (node 207:18) */
.rg-nav .current-menu-item > a,
.rg-nav .current-menu-ancestor > a { color: var(--rg-bronze); }

/* --- Submenu de "Nossos serviços" ---------------------------------------- */
.rg-nav__list > li.menu-item-has-children > a::after {
  content: ""; display: inline-block; margin-left: 7px; vertical-align: 2px;
  width: 5px; height: 5px; border-right: 1px solid currentColor;
  border-bottom: 1px solid currentColor; transform: rotate(45deg) translate(-1px, -1px);
  transition: transform .2s ease;
}
.rg-nav__list > li.menu-item-has-children:hover > a::after,
.rg-nav__list > li.menu-item-has-children:focus-within > a::after {
  transform: rotate(-135deg) translate(-2px, -2px);
}
/* ponte invisível entre o item e o painel, para o mouse não perder o hover */
.rg-nav__list > li.menu-item-has-children::after {
  content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 18px;
}
/* O painel desce e cresce a partir do topo; os itens entram em cascata. */
.rg-nav .sub-menu {
  position: absolute; top: calc(100% + 18px); left: 50%;
  min-width: 268px; padding: 10px 0;
  background: var(--rg-teal); border-radius: 10px;
  box-shadow: 0 16px 40px rgba(1, 1, 1, .28);
  transform-origin: top center;
  opacity: 0; visibility: hidden;
  transform: translate(-50%, -12px) scale(.97);
  transition: opacity var(--rg-dur-rapida) ease,
              transform var(--rg-dur-media) var(--rg-ease),
              visibility var(--rg-dur-media);
  z-index: 30;
}
.rg-nav__list > li:hover > .sub-menu,
.rg-nav__list > li:focus-within > .sub-menu {
  opacity: 1; visibility: visible; transform: translate(-50%, 0) scale(1);
}

.rg-nav .sub-menu li {
  opacity: 0; transform: translateY(-8px);
  transition: opacity var(--rg-dur-rapida) ease,
              transform var(--rg-dur-media) var(--rg-ease);
}
.rg-nav__list > li:hover > .sub-menu li,
.rg-nav__list > li:focus-within > .sub-menu li {
  opacity: 1; transform: translateY(0);
}
/* O atraso só existe na abertura — ao fechar, tudo recolhe junto. */
.rg-nav__list > li:hover > .sub-menu li:nth-child(1),
.rg-nav__list > li:focus-within > .sub-menu li:nth-child(1) { transition-delay: 80ms; }
.rg-nav__list > li:hover > .sub-menu li:nth-child(2),
.rg-nav__list > li:focus-within > .sub-menu li:nth-child(2) { transition-delay: 140ms; }
.rg-nav__list > li:hover > .sub-menu li:nth-child(3),
.rg-nav__list > li:focus-within > .sub-menu li:nth-child(3) { transition-delay: 200ms; }
.rg-nav__list > li:hover > .sub-menu li:nth-child(n+4),
.rg-nav__list > li:focus-within > .sub-menu li:nth-child(n+4) { transition-delay: 260ms; }

.rg-nav .sub-menu a {
  position: relative; display: block; padding: 11px 24px;
  font-size: var(--rg-fs-nav); line-height: 1.35; color: var(--rg-white);
  letter-spacing: 0.01em;
  transition: background-color var(--rg-dur-rapida) ease,
              color var(--rg-dur-rapida) ease,
              padding-left var(--rg-dur-rapida) var(--rg-ease);
}
/* filete bronze que cresce da esquerda */
.rg-nav .sub-menu a::before {
  content: ""; position: absolute; left: 12px; top: 50%;
  width: 0; height: 1px; background: var(--rg-bronze);
  transform: translateY(-50%);
  transition: width var(--rg-dur-rapida) var(--rg-ease);
}
.rg-nav .sub-menu a:hover,
.rg-nav .sub-menu a:focus-visible {
  background: rgba(180, 135, 90, .16); color: var(--rg-bronze); padding-left: 34px;
}
.rg-nav .sub-menu a:hover::before,
.rg-nav .sub-menu a:focus-visible::before { width: 12px; }

.rg-lang {                                   /* Figma: x 1303, y 44 (node 68:1360) */
  position: absolute; right: 2px; top: -46px;  /* alinhado a direita do menu */
  display: flex; align-items: center; gap: 6px;
  font-size: var(--rg-fs-xs); line-height: 1; color: var(--rg-teal-alt);
}
.rg-header--sobreposto .rg-lang { color: var(--rg-white); }
.rg-lang__item.is-active { font-weight: 600; }
.rg-lang__sep { opacity: .6; }

.rg-header__toggle { display: none; }


/* --------------------------------------------------------------------------
   RODAPE                   Figma: 5255 -> 5585
   logo x72 | nav x523 | contato x852 | social x1195 | base y5527
   -------------------------------------------------------------------------- */
.rg-footer { background: var(--rg-white); }
/* Colunas ancoradas nas posicoes do Figma, medidas a partir de x=72:
   menu 523-72=451 | contato 852-72=780 | social 1195-72=1123 */
.rg-footer__inner {
  display: grid; grid-template-columns: 451px 329px 343px auto;
  /* menu 523 | contato 852 | social 1195, medidos a partir de x=72 */
  align-items: start; padding: calc(var(--rg-secao-y) * .46) 24px 0 72px;
}
.rg-footer__brand { margin-top: 11px; }
.rg-footer__brand a { display: inline-block; transition: opacity var(--rg-dur-rapida) ease; }
.rg-footer__brand a:hover { opacity: .72; }
.rg-header__logo { transition: opacity var(--rg-dur-rapida) ease; }
.rg-header__logo:hover { opacity: .82; }
.rg-footer__nav   { width: auto; }
.rg-footer__list, .rg-footer__list .sub-menu { margin: 0; padding: 0; list-style: none; }
.rg-footer__list > li { line-height: 30px; }
.rg-footer__list a {
  font-size: var(--rg-fs-nav); color: var(--rg-green);
  white-space: nowrap;                       /* "Nossos serviços" em uma linha */
  transition: color var(--rg-dur-rapida) ease;
}
.rg-footer__list a:hover { color: var(--rg-bronze); }

/* Submenu no rodape: recuado sob o item pai, um grau menor e mais leve. */
.rg-footer__list .sub-menu {
  margin: 2px 0 10px; padding-left: 12px;
  border-left: 1px solid rgba(32, 52, 40, .18);
}
.rg-footer__list .sub-menu li { line-height: 26px; }
.rg-footer__list .sub-menu a { font-size: var(--rg-fs-xs); opacity: .78; }
.rg-footer__list .sub-menu a:hover { opacity: 1; }
.rg-footer__col--contato { width: 187px; margin-top: 13px; }
.rg-footer__col--social  { margin-top: 10px; }
.rg-footer__titulo { margin: 0 0 8px; font-size: var(--rg-fs-body); font-weight: 500; color: var(--rg-brown); line-height: 23px; }
.rg-footer__texto { margin: 0; font-size: var(--rg-fs-nav); line-height: 23px; }
.rg-social { display: flex; align-items: center; gap: 12px; margin: 6px 0 0; padding: 0; list-style: none; }
.rg-social a {
  display: grid; place-items: center; width: 32px; height: 32px;
  margin: -6px; border-radius: 50%;
  transition: background-color var(--rg-dur-rapida) ease, transform var(--rg-dur-rapida) var(--rg-ease);
}
.rg-social a:hover { background: rgba(180, 135, 90, .18); transform: translateY(-1px); }
.rg-social img { width: 20px; height: 20px; display: block; }

.rg-footer__base { display: flex; align-items: center; justify-content: space-between;
                   padding: 40px 37px calc(var(--rg-secao-y) * .46) 74px; }
.rg-footer__copy, .rg-footer__assinatura { margin: 0; font-size: var(--rg-fs-xs); color: var(--rg-green); opacity: .8; }
.rg-footer__assinatura a { border-bottom: 1px solid transparent; transition: border-color .18s ease, color .18s ease; }
.rg-footer__assinatura a:hover { color: var(--rg-bronze); border-bottom-color: currentColor; }