/* Barra do topo e menu mobile. */

/* ---------- navbar ---------- */
.topo{position:absolute;top:0;left:0;right:0;z-index:5;display:flex;align-items:center;
  justify-content:space-between;gap:2rem;padding:clamp(1rem,2.4vw,2rem) clamp(1.2rem,4vw,3.4rem);
  background:linear-gradient(rgba(14,11,8,.55),transparent)}
.marca{display:flex;align-items:center;gap:.8rem}
.marca img{height:clamp(34px,3.4vw,46px);width:auto;opacity:.95}
.marca span{font-family:var(--nav);font-stretch:125%;font-weight:800;font-size:.86rem;letter-spacing:.22em;
  text-transform:uppercase;color:#EDE3D2}
.menu{display:flex;align-items:center;gap:clamp(1.8rem,3.4vw,3.2rem);list-style:none;
  font-family:var(--nav);font-stretch:125%;font-weight:800;font-size:.72rem;letter-spacing:.24em;text-transform:uppercase}
.menu li:last-child{margin-left:clamp(.4rem,1vw,1rem)}
.menu a{color:rgba(237,227,210,.82);padding:.45em 0;border-bottom:1.5px solid transparent;transition:color .25s,border-color .25s}
.menu a:hover,.menu a:focus-visible{color:#fff;border-color:#c8102e}
.menu a.arte{padding:0;border:0}

.abre-menu{display:none;background:none;border:0;cursor:pointer;width:44px;height:44px;position:relative}
.abre-menu i{position:absolute;left:11px;right:11px;height:1.5px;background:var(--osso);transition:transform .3s,opacity .2s}
.abre-menu i:nth-of-type(1){top:16px}.abre-menu i:nth-of-type(2){top:22px}.abre-menu i:nth-of-type(3){top:28px}
.aberto .abre-menu i:nth-of-type(1){transform:translateY(6px) rotate(45deg)}
.aberto .abre-menu i:nth-of-type(2){opacity:0}
.aberto .abre-menu i:nth-of-type(3){transform:translateY(-6px) rotate(-45deg)}