.site-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:28px;
  padding:22px 5%;
  border-bottom:1px solid transparent;
  overflow:visible;
}
.site-header .brand{
  font:32px/1 Georgia,serif;
  letter-spacing:-.8px;
  text-decoration:none;
  color:inherit;
}
.brand-block{display:flex;flex-direction:column;gap:7px}
.brand-tagline{
  margin:0;
  font-size:13px;
  color:var(--muted,#5e7075);
  letter-spacing:.02em;
}
.site-nav-root{
  display:flex;
  align-items:center;
  gap:8px 4px;
  margin-left:auto;
  position:relative;
}
.site-nav-list{
  display:flex;
  align-items:center;
  gap:8px 28px;
  list-style:none;
  margin:0;
  padding:0;
}
.site-nav-item{position:relative}
.site-nav-item>a,
.nav-explore{
  display:block;
  padding:10px 0;
  font-size:15px;
  color:var(--ink,#103747);
  text-decoration:none;
  background:none;
  border:0;
  cursor:pointer;
  font-family:inherit;
}
.nav-explore{
  display:inline-flex;
  align-items:center;
  gap:6px;
  position:relative;
  color:inherit;
}
.nav-caret{
  width:11px;
  height:8px;
  transition:transform 180ms ease;
}
.has-panel.is-open .nav-caret,
.has-panel.is-open .nav-explore{color:var(--copper,#ad542c)}
.has-panel.is-open .nav-caret{transform:rotate(0deg)}
.nav-caret{transform:rotate(180deg)}
.nav-wave-mark{
  position:absolute;
  left:0;
  right:18px;
  bottom:2px;
  width:46px;
  height:10px;
  color:var(--copper,#ad542c);
  pointer-events:none;
}
.site-nav-item.is-current>a,
.site-nav-item>a:hover,
.nav-explore:hover{
  color:var(--copper,#ad542c);
}
.site-nav-sub{
  display:none;
  position:absolute;
  top:100%;
  right:0;
  min-width:220px;
  padding:10px 0;
  margin:0;
  list-style:none;
  background:var(--paper,#f8f5ee);
  border:1px solid var(--rule,#d5d4ca);
  box-shadow:0 12px 30px -18px rgba(16,55,71,.45);
  z-index:40;
}
.site-nav-item:not(.has-panel):hover>.site-nav-sub,
.site-nav-item:not(.has-panel):focus-within>.site-nav-sub{
  display:block;
}
.site-nav-sub a{
  display:block;
  padding:9px 16px;
  font-size:14px;
  color:var(--ink,#103747);
  text-decoration:none;
}
.site-nav-sub a:hover,
.site-nav-sub a.is-current{color:var(--copper,#ad542c)}

.explore-panel{
  position:absolute;
  top:calc(100% + 10px);
  width:600px;
  display:grid;
  grid-template-columns:1.05fr 1.15fr;
  background:#fbf8f1;
  border:1px solid var(--rule,#d5d4ca);
  border-radius:14px;
  box-shadow:0 18px 40px -22px rgba(16,55,71,.45);
  z-index:50;
  overflow:hidden;
  opacity:0;
  pointer-events:none;
  transition:opacity 180ms ease, transform 180ms ease;
}
.has-panel[data-menu="explorar"] .explore-panel,
.has-panel[data-menu="aprender"] .explore-panel{
  left:0;
  right:auto;
  transform:translateY(8px);
}
.has-panel[data-menu="pesquisa"] .explore-panel,
.has-panel[data-menu="sobre"] .explore-panel{
  left:auto;
  right:0;
  transform:translateY(8px);
}
.has-panel.is-open .explore-panel{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}
.explore-panel::before{
  content:"";
  position:absolute;
  top:-7px;
  width:12px;
  height:12px;
  background:#fbf8f1;
  border-left:1px solid var(--rule,#d5d4ca);
  border-top:1px solid var(--rule,#d5d4ca);
  transform:rotate(45deg);
}
.has-panel[data-menu="explorar"] .explore-panel::before{left:42px;right:auto}
.has-panel[data-menu="aprender"] .explore-panel::before{left:58px;right:auto}
.has-panel[data-menu="pesquisa"] .explore-panel::before{right:92px;left:auto}
.has-panel[data-menu="sobre"] .explore-panel::before{right:48px;left:auto}
.explore-list{
  padding:18px 14px 14px 16px;
  border-right:1px solid var(--rule,#d5d4ca);
  display:flex;
  flex-direction:column;
  min-width:0;
}
.explore-kicker{
  margin:0 8px 12px;
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--muted,#5e7075);
}
.explore-lab{
  display:grid;
  grid-template-columns:28px 1fr auto;
  gap:10px;
  align-items:center;
  padding:11px 10px;
  border-radius:8px;
  text-decoration:none;
  color:inherit;
  border-left:2px solid transparent;
}
.explore-lab.is-active{
  background:#f4ebe3;
  border-left-color:var(--copper,#ad542c);
}
.explore-lab:hover{color:inherit}
.explore-ico{
  display:flex;
  color:var(--ink,#103747);
}
.explore-ico svg{
  width:22px;
  height:22px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.5;
  stroke-linecap:round;
}
.explore-copy strong{
  display:block;
  font:17px/1.2 Georgia,serif;
}
.explore-copy em{
  display:block;
  margin-top:3px;
  font-style:normal;
  font-size:12px;
  color:var(--muted,#5e7075);
}
.explore-go{
  color:var(--copper,#ad542c);
  opacity:0;
  transition:opacity 180ms ease;
}
.explore-lab.is-active .explore-go{opacity:1}
.explore-all{
  margin:10px 8px 0;
  padding-top:12px;
  border-top:1px solid var(--rule,#d5d4ca);
  font-size:13px;
  text-decoration:none;
  color:inherit;
}
.explore-all span{color:var(--copper,#ad542c);margin-left:4px}
.explore-preview{
  padding:14px 14px 12px;
  min-width:0;
  display:flex;
  flex-direction:column;
}
.explore-preview canvas{
  width:100%;
  height:168px;
  display:block;
  border-radius:8px;
  background:#eef3f4;
}
.explore-caption{
  margin:12px 0 0;
  font:18px/1.25 Georgia,serif;
}
.explore-preview-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:12px;
}
.explore-open{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border:1px solid var(--copper,#ad542c);
  border-radius:8px;
  color:var(--copper,#ad542c);
  font-size:13px;
  text-decoration:none;
}
.explore-index{
  font-size:11px;
  letter-spacing:.12em;
  color:var(--muted,#5e7075);
}

.nav-search{
  display:flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border:0;
  background:transparent;
  color:inherit;
  cursor:pointer;
  margin-left:6px;
}
.nav-search:hover{color:var(--copper,#ad542c)}
.nav-burger{
  display:none;
  border:0;
  background:transparent;
  color:inherit;
  cursor:pointer;
  font-size:14px;
  padding:8px 0;
}
.site-search{
  position:fixed;
  inset:0;
  z-index:130;
  background:rgba(16,55,71,.28);
  display:flex;
  justify-content:center;
  padding:12vh 5% 0;
}
.site-search[hidden]{display:none!important}
.site-search-panel{
  width:min(560px,100%);
  background:var(--paper,#f8f5ee);
  border:1px solid var(--rule,#d5d4ca);
  padding:18px;
}
.site-search-panel input{
  width:100%;
  border:0;
  border-bottom:1px solid var(--rule,#d5d4ca);
  background:transparent;
  padding:8px 0 12px;
  font:18px Georgia,serif;
  color:var(--ink,#103747);
  outline:none;
}
.site-search-results{
  list-style:none;
  margin:12px 0 0;
  padding:0;
  max-height:50vh;
  overflow:auto;
}
.site-search-results a{
  display:block;
  padding:12px 0;
  border-bottom:1px solid var(--rule,#d5d4ca);
  text-decoration:none;
  color:inherit;
}
.site-search-results strong{display:block;font:18px Georgia,serif}
.site-search-results span{
  display:block;
  margin-top:4px;
  font-size:13px;
  color:var(--muted,#5e7075);
}
.site-search-empty{padding:16px 0;color:var(--muted,#5e7075);font-size:14px}
body.nav-open,
body.search-open{overflow:hidden}

.masthead .site-nav-root{margin-left:0}
.masthead{flex-wrap:wrap}
.masthead .site-nav-item>a,
.masthead .nav-explore,
.masthead .nav-search,
.masthead .nav-burger{color:var(--ivory,#f5f0e5)}
.masthead .site-nav-item.is-current>a,
.masthead .site-nav-item>a:hover,
.masthead .nav-explore:hover,
.masthead .has-panel.is-open .nav-explore,
.masthead .nav-search:hover{color:var(--copper,#dea878)}

@media(prefers-reduced-motion:reduce){
  .explore-panel,
  .nav-caret,
  .explore-go{transition:none}
}

@media(max-width:860px){
  .nav-burger{display:block}
  .site-nav{
    display:none;
    position:fixed;
    left:0;right:0;top:72px;
    bottom:auto;
    background:var(--paper,#f8f5ee);
    border-bottom:1px solid var(--rule,#d5d4ca);
    padding:8px 5% 18px;
    z-index:30;
    max-height:calc(100vh - 72px);
    overflow:auto;
  }
  .site-header{position:relative}
  body.nav-open .site-nav{display:block}
  .site-nav-list{display:block}
  .site-nav-item>a,
  .nav-explore{
    padding:14px 0;
    border-bottom:1px solid var(--rule,#d5d4ca);
    width:100%;
  }
  .site-nav-sub{
    display:block;
    position:static;
    border:0;
    box-shadow:none;
    background:transparent;
    padding:0 0 10px 12px;
    min-width:0;
  }
  .explore-panel{
    position:static;
    width:auto;
    grid-template-columns:1fr;
    border:0;
    border-radius:0;
    box-shadow:none;
    background:transparent;
    opacity:1;
    transform:none;
    pointer-events:none;
    max-height:0;
    overflow:hidden;
    transition:max-height 180ms ease;
  }
  .explore-panel::before{display:none}
  .has-panel.is-open .explore-panel{
    pointer-events:auto;
    max-height:420px;
  }
  .explore-preview{display:none}
  .explore-list{
    border:0;
    padding:8px 0 4px;
  }
  .explore-lab{
    padding:12px 8px;
  }
  .explore-go{opacity:1;color:var(--muted,#5e7075)}
  .explore-lab.is-active .explore-go{color:var(--copper,#ad542c)}
  .masthead .site-nav{
    background:var(--petrol,#103d48);
    border-color:rgba(245,240,229,.2);
  }
  .masthead .site-nav-item>a,
  .masthead .nav-explore,
  .masthead .site-nav-sub a,
  .masthead .explore-lab,
  .masthead .explore-all,
  .masthead .explore-copy em{color:var(--ivory,#f5f0e5);border-color:rgba(245,240,229,.18)}
  .masthead .explore-lab.is-active{background:rgba(245,240,229,.08)}
}

@media(max-width:600px){
  .explore-panel{width:auto}
}
