:root{
  --cartao:#e6dfcd;
  --papel:#f8f4ea;
  --papel-2:#efe8d8;
  --tinta:#2e2921;
  --tinta-2:#5a5143;
  --musgo:#47552d;
  --musgo-2:#6b7a47;
  --musgo-veu:#e1e5d0;
  --ferrugem:#93452a;
  --ferrugem-veu:#f3e3d8;
  --fio:#cdc2aa;
  --cinta:#a8946a;
  --largura:72rem;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{
  margin:0;
  background-color:var(--cartao);
  background-image:repeating-linear-gradient(90deg,rgba(120,100,60,.035) 0 2px,transparent 2px 7px);
  color:var(--tinta);
  font-family:"Alegreya Sans",system-ui,sans-serif;
  font-size:1.125rem;
  line-height:1.62;
  overflow-wrap:break-word;
}
a{color:var(--musgo);text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{color:var(--ferrugem)}
a:focus-visible,button:focus-visible{outline:2px solid var(--ferrugem);outline-offset:3px}

#direto{position:absolute;left:-9999px;top:0;background:var(--papel);padding:.5rem 1rem;z-index:20}
#direto:focus{left:1rem;top:1rem}

/* cabeçalho com as cintas da prensa */
#topo{
  position:relative;
  max-width:var(--largura);
  margin:0 auto;
  padding:1.1rem 1.25rem .9rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
}
#topo::after{
  content:"";
  position:absolute;
  left:1.25rem;right:1.25rem;bottom:0;
  height:3px;
  border-top:1px solid var(--cinta);
  border-bottom:1px solid var(--cinta);
  opacity:.7;
  pointer-events:none;
}
#topo > a{
  position:relative;z-index:1;
  display:flex;align-items:center;gap:.6rem;
  text-decoration:none;color:var(--tinta);
}
#topo > a img{display:block}
#topo > a span{display:flex;flex-direction:column;line-height:1.1}
#topo > a strong{font-family:"Italiana",Georgia,serif;font-weight:400;font-size:1.55rem;letter-spacing:.04em}
#topo > a small{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--tinta-2)}

#ramos{position:relative;z-index:5}
#ramos > button{
  display:none;
  font:inherit;font-size:.95rem;
  background:var(--papel);
  color:var(--tinta);
  border:1px solid var(--tinta-2);
  border-radius:2px;
  padding:.45rem .8rem;
  cursor:pointer;
  white-space:nowrap;
}
#galhos{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.15rem .9rem;justify-content:flex-end}
#galhos a{
  display:block;
  padding:.3rem .1rem;
  color:var(--tinta);
  text-decoration:none;
  font-size:.98rem;
  border-bottom:1px solid transparent;
}
#galhos a:hover{border-bottom-color:var(--musgo)}
#galhos a[aria-current="page"]{color:var(--musgo);border-bottom-color:var(--musgo);font-weight:500}

#ressalva{
  max-width:var(--largura);
  margin:.9rem auto .9rem;
  padding:0 1.25rem;
}
#ressalva p{
  margin:0;
  background:var(--ferrugem-veu);
  border-left:4px solid var(--ferrugem);
  padding:.6rem .9rem;
  font-size:.98rem;
  color:#4a2a1c;
}

/* a lâmina: folha montada sobre o cartão */
#exsicata{
  max-width:var(--largura);
  margin:0 auto 2.5rem;
  padding:0 1.25rem;
  display:grid;
  grid-template-columns:minmax(0,1fr) 18.5rem;
  gap:2.25rem;
  align-items:start;
}
#exsicata > article{
  background:var(--papel);
  padding:2.4rem 2.6rem 2rem;
  box-shadow:0 1px 0 rgba(0,0,0,.05),0 10px 26px -12px rgba(60,45,20,.35);
  border:1px solid #ddd3bd;
  min-width:0;
  counter-reset:lamina;
}
#exsicata > article > header{margin-bottom:1.6rem;padding-bottom:1.2rem;border-bottom:1px dashed var(--fio)}
#exsicata > article > header p:first-child{
  margin:0 0 .5rem;
  font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;color:var(--tinta-2);
}
h1,h2,h3{font-family:"Italiana",Georgia,serif;font-weight:400;color:var(--tinta);line-height:1.18}
h1{font-size:clamp(2rem,1.35rem + 2.4vw,3.05rem);margin:0 0 1rem;letter-spacing:.01em}
h2{font-size:clamp(1.55rem,1.25rem + 1vw,2.05rem);margin:0 0 .8rem}
h3{font-size:1.35rem;margin:1.4rem 0 .5rem;font-family:"Alegreya Sans",sans-serif;font-weight:700;letter-spacing:0}
#exsicata > article > section{margin-top:2.3rem;counter-increment:lamina}
#exsicata > article > section > h2::before{
  content:"lâmina " counter(lamina,decimal-leading-zero);
  display:block;
  font-family:"Alegreya Sans",sans-serif;
  font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--musgo-2);
  margin-bottom:.35rem;
}
p{margin:0 0 1rem}
ul,ol{margin:0 0 1rem;padding-left:1.3rem}
li{margin-bottom:.35rem}
strong{font-weight:700}

/* bloco de destaque: etiqueta de herbário dentro do texto */
#exsicata > article dl{
  margin:0 0 1.2rem;
  border:1px solid var(--tinta-2);
  outline:1px solid var(--tinta-2);
  outline-offset:3px;
  background:#fffdf7;
  padding:.9rem 1rem;
  display:grid;
  grid-template-columns:minmax(7.5rem,max-content) 1fr;
  gap:.35rem 1rem;
  font-size:1rem;
}
#exsicata > article dt{font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--tinta-2);padding-top:.15rem}
#exsicata > article dd{margin:0}

/* tabelas como livro de registro */
#exsicata div[role="region"]{overflow-x:auto;margin:0 0 1.4rem;-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%;font-size:1rem;background:#fffdf7}
caption{caption-side:bottom;text-align:left;font-size:.88rem;color:var(--tinta-2);padding:.55rem 0 0;font-style:italic}
th,td{text-align:left;vertical-align:top;padding:.55rem .7rem;border-bottom:1px solid var(--fio)}
thead th{font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--tinta-2);border-bottom:2px solid var(--tinta-2);font-weight:500}
tbody th{font-weight:500}

blockquote{margin:0 0 1rem;padding:.4rem 0 .4rem 1rem;border-left:3px solid var(--musgo-2);color:var(--tinta-2)}

/* perguntas */
#questoes details{border-top:1px solid var(--fio);padding:.7rem 0}
#questoes details:last-of-type{border-bottom:1px solid var(--fio)}
#questoes summary{cursor:pointer;font-weight:700;list-style-position:outside}
#questoes details p{margin:.6rem 0 0}

/* ajuda: carimbo */
#exsicata aside[aria-label="Ajuda gratuita"]{
  border:2px solid var(--musgo);
  background:var(--musgo-veu);
  padding:1rem 1.1rem;
  margin:1.2rem 0;
}
#exsicata aside[aria-label="Ajuda gratuita"] p:last-child{margin-bottom:0}

/* etiqueta lateral de coleta */
#etiqueta{
  position:sticky;top:1.2rem;
  display:flex;flex-direction:column;gap:1.1rem;
}
#etiqueta > section{
  background:#fffdf7;
  border:1px solid var(--tinta-2);
  outline:1px solid var(--tinta-2);
  outline-offset:3px;
  padding:1rem 1.05rem;
  font-size:.95rem;
}
#etiqueta h2{font-size:1.25rem;margin:0 0 .6rem;letter-spacing:.03em}
#etiqueta dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:.25rem .7rem}
#etiqueta dt{font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--tinta-2);padding-top:.2rem}
#etiqueta dd{margin:0}
#etiqueta img{display:block;width:100%;height:auto}
#etiqueta p{margin:0 0 .6rem}
#etiqueta p:last-child{margin:0}

/* rodapé: a base da prensa */
#prensa{
  background:#3a342a;
  color:#eae3d2;
  margin-top:2rem;
  border-top:10px solid var(--cinta);
}
#prensa > div{
  max-width:var(--largura);
  margin:0 auto;
  padding:2rem 1.25rem 1.6rem;
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr;
  gap:1.8rem;
}
#prensa h2{color:#f4eedf;font-size:1.3rem;margin:0 0 .6rem}
#prensa p{font-size:.95rem;margin:0 0 .7rem}
#prensa a{color:#d9e0b8}
#prensa a:hover{color:#fff}
#prensa ul{list-style:none;padding:0;margin:0;font-size:.95rem}
#prensa > p{
  max-width:var(--largura);margin:0 auto;padding:1rem 1.25rem 1.6rem;
  border-top:1px solid rgba(255,255,255,.14);
  font-size:.86rem;color:#c9c0aa;
}

/* 404 */
#extraviada{max-width:44rem;margin:1rem auto 3rem;padding:0 1.25rem}
#extraviada > article{background:var(--papel);padding:2.4rem 2.2rem;border:1px dashed var(--tinta-2);text-align:left}
#extraviada ul{list-style:none;padding:0;display:grid;gap:.4rem}

@media (min-width:1700px){
  :root{--largura:78rem}
  body{font-size:1.18rem}
}
@media (min-width:2200px){
  :root{--largura:88rem}
  body{font-size:1.28rem}
  #exsicata{grid-template-columns:minmax(0,1fr) 21rem;gap:2.75rem}
}
@media (max-width:1100px){
  #exsicata{grid-template-columns:minmax(0,1fr) 15.5rem;gap:1.5rem}
  #exsicata > article{padding:2rem 1.8rem}
}
@media (max-width:900px){
  #exsicata{grid-template-columns:minmax(0,1fr)}
  #etiqueta{position:static;display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}
  #prensa > div{grid-template-columns:1fr 1fr}
  #prensa > div > section:first-child{grid-column:1 / -1}
}
@media (max-width:860px){
  #ramos > button{display:block}
  #ramos > button::after{content:" \25BE"}
  #galhos{
    display:none;
    position:absolute;right:0;top:calc(100% + .4rem);
    width:min(18rem,calc(100vw - 2.5rem));
    flex-direction:column;gap:0;
    background:var(--papel);
    border:1px solid var(--tinta-2);
    box-shadow:0 12px 24px -10px rgba(40,30,15,.45);
    padding:.4rem .9rem;
  }
  #galhos a{padding:.6rem 0;border-bottom:1px solid var(--fio)}
  #galhos li:last-child a{border-bottom:0}
  #ramos:focus-within #galhos,#ramos:hover #galhos,#galhos:active{display:flex}
}
@media (max-width:560px){
  body{font-size:1.06rem}
  #topo{padding:.9rem 1rem .8rem}
  #topo > a strong{font-size:1.3rem}
  #topo > a small{font-size:.7rem}
  #topo::after{left:1rem;right:1rem}
  #ressalva,#exsicata{padding:0 .75rem}
  #exsicata > article{padding:1.5rem 1.1rem 1.3rem}
  #exsicata > article dl{grid-template-columns:1fr;gap:.1rem}
  #exsicata > article dd{margin-bottom:.45rem}
  #prensa > div{grid-template-columns:1fr}
  th,td{padding:.5rem .45rem}
}

/* etiqueta de viveiro: acesso à marca (links de parceria comercial) */
.viveiro{
  display:inline-block;
  background:var(--ferrugem);
  color:#fffdf7;
  font-weight:700;
  font-size:1rem;
  line-height:1.25;
  letter-spacing:.02em;
  text-align:center;
  text-decoration:none;
  padding:.7rem 1.3rem;
  border:1px solid #6f3420;
  border-radius:6px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 3px 8px -3px rgba(60,30,15,.5);
  transition:background-color .15s ease,box-shadow .15s ease;
}
.viveiro:hover,.viveiro:focus-visible{background:#6f3420;color:#fffdf7;text-decoration:none}
.viveiro:active{background:#5a2a19;box-shadow:inset 0 2px 4px rgba(0,0,0,.3)}
.viveiro:focus-visible{outline:2px solid var(--musgo);outline-offset:3px}

/* variante compacta do cabeçalho (vence a regra "#topo > a") */
#topo > #ramos{margin-left:auto}
#topo > a.viveiro-mastro{
  display:inline-block;
  flex:0 0 auto;
  gap:0;
  padding:.5rem 1rem;
  font-size:.95rem;
  white-space:nowrap;
  color:#fffdf7;
}
#topo > a.viveiro-mastro:hover,
#topo > a.viveiro-mastro:focus-visible{color:#fffdf7;background:#6f3420}

/* faixa de destaque dentro do texto */
.viveiro-faixa{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:.8rem 1.4rem;
  margin:1.4rem 0 0;
  padding:.95rem 1.1rem;
  background:var(--ferrugem-veu);
  border:1px solid var(--cinta);
  border-left:4px solid var(--ferrugem);
}
.viveiro-faixa p{margin:0;flex:1 1 17rem;font-size:1rem;color:#4a2a1c}
.viveiro-faixa .viveiro{flex:0 1 auto}

@media (max-width:1100px){
  #topo{flex-wrap:wrap}
  #topo > a.viveiro-mastro{order:3;margin-left:auto}
}
@media (max-width:720px){
  #topo > a.viveiro-mastro{
    flex:1 1 100%;
    margin-top:.15rem;
    padding:.65rem 1rem;
    font-size:1rem;
    white-space:normal;
  }
}
@media (max-width:560px){
  .viveiro-faixa{padding:.85rem .9rem}
  .viveiro-faixa .viveiro{flex:1 1 100%;width:100%}
}
