/* Encontro das Deusas, RED0_001_SITE_RETIRO, topo.css
   Barra de progresso, topo, menu e menu sanduíche. */
/* progresso */
#prog{position:fixed;top:0;left:0;height:2px;width:0;background:linear-gradient(90deg,var(--lilas),var(--ouro));z-index:60}

/* topo */
header{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .5s,box-shadow .5s,padding .5s;padding:22px 0}
header.sol{background:rgba(246,242,236,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 1px 0 rgba(46,36,64,.08);padding:12px 0}
.topo{display:flex;align-items:center;justify-content:space-between;gap:20px}
.marca{font-family:var(--serif);font-size:1.35rem;letter-spacing:.06em;color:#fff;text-decoration:none;white-space:nowrap;transition:color .5s}
.marca i{color:var(--lilas-cl)}
header.sol .marca{color:var(--ameixa)}header.sol .marca i{color:var(--lilas-esc)}
nav ul{display:flex;gap:22px;list-style:none}
nav a{text-decoration:none;color:rgba(255,255,255,.88);font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;position:relative;padding:6px 0;transition:color .4s;white-space:nowrap}
nav a:after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .5s}
nav a:hover:after,nav a.at:after{transform:scaleX(1);transform-origin:left}
header.sol nav a{color:var(--texto)}header.sol nav a.at{color:var(--lilas-esc)}
.hamb{display:none;background:none;border:0;width:40px;height:40px;cursor:pointer;position:relative;z-index:70}
.hamb span{display:block;height:1px;width:26px;background:#fff;margin:7px auto;transition:.4s}
header.sol .hamb span,body.menu .hamb span{background:var(--ameixa)}
body.menu .hamb span:nth-child(1){transform:translateY(8px) rotate(45deg)}
body.menu .hamb span:nth-child(2){opacity:0}
body.menu .hamb span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
/* contraste do topo sobre o céu */
header:not(.sol):before{content:"";position:absolute;inset:0 0 -40px 0;background:linear-gradient(180deg,rgba(46,36,64,.5),rgba(46,36,64,0));pointer-events:none;z-index:-1}

@media (max-width:980px){
  nav{position:fixed;inset:0;background:var(--areia);display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .5s;z-index:60}
  body.menu nav{opacity:1;pointer-events:auto}
  nav ul{flex-direction:column;align-items:center;gap:26px}
  nav a,header.sol nav a{color:var(--ameixa);font-family:var(--serif);font-size:2rem;letter-spacing:0;text-transform:none;font-style:italic}
  .hamb{display:block}
  header .btn.pq{display:none}
}
@media (min-width:981px) and (max-width:1240px){nav ul{gap:16px}nav a{font-size:.74rem;letter-spacing:.1em}header .btn.pq{display:none}}

/* etapa 1: símbolo do logo no topo (branco sobre o Hero, ameixa ao rolar) */
header .marca{display:block;position:relative;line-height:0}
header .marca img{display:block;height:52px;width:auto;transition:opacity .5s,height .5s}
header .marca .es{position:absolute;left:0;top:0;opacity:0}
header.sol .marca img{height:42px}
header.sol .marca .cl{opacity:0}header.sol .marca .es{opacity:1}