/* Barra de navegação, logo e menu mobile */

header.nav {
  position:fixed;
  top:env(safe-area-inset-top,0px);
  left:0;
  right:0;
  z-index:50;
  transition:background .3s,box-shadow .3s,padding .3s;
  padding:22px 0;
}

header.nav.scrolled {
  background:rgba(21,17,14,.94);
  backdrop-filter:blur(8px);
  box-shadow:0 1px 0 rgba(184,147,90,.25);
  padding:12px 0;
}

.nav .wrap {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}

.brand {
  font-family:var(--serif);
  font-size:1.6rem;
  letter-spacing:.38em;
  color:var(--ouro-claro);
  font-weight:500;
}

.brand small {
  display:block;
  font-family:var(--sans);
  font-size:.5rem;
  letter-spacing:.42em;
  margin-top:-2px;
  color:var(--ouro);
}

nav ul {
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  gap:6px;
  align-items:center;
}

nav a.link,
nav button.link {
  background:none;
  border:0;
  color:var(--marfim);
  font:400 .85rem var(--sans);
  letter-spacing:.14em;
  padding:10px 14px;
  cursor:pointer;
  position:relative;
  display:inline-flex;
  gap:6px;
  align-items:center;
}

nav a.link::after,
nav button.link::after {
  content:"";
  position:absolute;
  left:14px;
  right:14px;
  bottom:4px;
  height:1px;
  background:var(--ouro);
  transform:scaleX(0);
  transition:transform .3s;
  transform-origin:left;
}

nav a.link:hover::after,
nav a.link.active::after,
nav li:hover>button.link::after,
nav button.link[aria-expanded=true]::after {
  transform:scaleX(1);
}

nav a.link.active {
  color:var(--ouro-claro);
}

.has-sub {
  position:relative;
}

.sub {
  position:absolute;
  top:100%;
  left:0;
  min-width:230px;
  background:var(--grafite2);
  border:1px solid rgba(184,147,90,.3);
  padding:8px;
  opacity:0;
  visibility:hidden;
  transform:translateY(8px);
  transition:.25s;
}

.has-sub:hover .sub,
.has-sub:focus-within .sub,
.has-sub.open .sub {
  opacity:1;
  visibility:visible;
  transform:none;
}

.sub a {
  display:block;
  padding:10px 14px;
  font-size:.9rem;
  color:var(--marfim);
}

.sub a:hover {
  background:rgba(184,147,90,.15);
  color:var(--ouro-claro);
}

.cta {
  border:1px solid var(--ouro);
  color:var(--ouro-claro);
  padding:10px 20px;
  font-size:.8rem;
  letter-spacing:.14em;
  transition:.25s;
}

.cta:hover {
  background:var(--ouro);
  color:var(--grafite);
}

.burger {
  display:none;
  background:none;
  border:1px solid rgba(184,147,90,.5);
  width:44px;
  height:44px;
  cursor:pointer;
  padding:0;
}

.burger span {
  display:block;
  width:20px;
  height:1px;
  background:var(--ouro-claro);
  margin:6px auto;
  transition:.3s;
}

.burger[aria-expanded=true] span:nth-child(1) {
  transform:translateY(7px) rotate(45deg);
}

.burger[aria-expanded=true] span:nth-child(2) {
  opacity:0;
}

.burger[aria-expanded=true] span:nth-child(3) {
  transform:translateY(-7px) rotate(-45deg);
}

footer .brand {
  display:inline-block;
  margin-bottom:10px;
}

header.nav {
  background:rgba(21,17,14,.96);
  padding:10px 0;
  backdrop-filter:none;
}

header.nav.scrolled {
  backdrop-filter:none;
  padding:6px 0;
}

.logo {
  margin:0;
  line-height:0;
}

.logo img {
  height:74px;
  width:auto;
  display:block;
  border-radius:14px;
  transition:height .3s;
}

.scrolled .logo img {
  height:58px;
}

.cta,
.tag {
  border-radius:999px;
}

.sub {
  border-radius:20px;
  padding:10px;
}

.sub a {
  border-radius:12px;
}

.burger {
  border-radius:14px;
}

@media (max-width:900px) {
  .burger {
    display:block;
  }
  nav {
    position:fixed;
    inset:0 0 0 auto;
    width:min(340px,86vw);
    background:var(--grafite2);
    padding:90px 20px 30px;
    transform:translateX(100%);
    transition:transform .35s;
    overflow:auto;
    border-left:1px solid rgba(184,147,90,.3);
  }
  nav.open {
    transform:none;
  }
  nav ul {
    flex-direction:column;
    align-items:stretch;
    gap:0;
  }
  nav a.link,
  nav button.link {
    width:100%;
    padding:16px 6px;
    border-bottom:1px solid rgba(184,147,90,.18);
    justify-content:space-between;
  }
  .sub {
    position:static;
    opacity:1;
    visibility:visible;
    transform:none;
    border:0;
    padding:0 0 0 12px;
    display:none;
    background:transparent;
  }
  .has-sub.open .sub {
    display:block;
  }
  .burger {
    position:relative;
    z-index:60;
  }
  .nav .cta {
    display:none;
  }
  header.nav nav a.cta {
    display:block;
    text-align:center;
    margin-top:14px;
  }
}

@media (max-width:900px) {
  .logo img {
    height:56px;
  }
}

header.nav,
header.nav.scrolled {
  background:#15110e;
}

.logo img {
  height:92px;
  border-radius:0;
}

.scrolled .logo img {
  height:70px;
}

@media (max-width:900px) {
  .logo img {
    height:64px;
  }
  .scrolled .logo img {
    height:56px;
  }
}

.uav {
  width:26px;
  height:26px;
  border-radius:50%;
  object-fit:cover;
  background:var(--ouro);
  color:var(--grafite);
  display:inline-grid;
  place-items:center;
  font-size:.8rem;
  font-weight:500;
}