/* ==========================================================================
   ARMAZÉM DOS BICHOS · PÁGINAS LEGAIS
   Termos de Uso e Política de Privacidade dividem esta folha.
   Identidade oficial da marca (Rubik + Montserrat, verde #0B7533), e não a
   voz de uma loja específica: o mesmo documento serve as três versões.
   ========================================================================== */

:root{
  --escuro:#0C1F12;
  --verde:#0B7533;
  --verde-fundo:#E9F2EA;
  --lima:#7ED957;
  --creme:#F7F5E9;
  --branco:#FFFFFF;
  --tinta:#12211A;
  --muted:#55634C;
  --muted-2:#7B8877;
  --sobre-escuro:rgba(247,245,233,.74);
  --line:rgba(18,33,26,.12);
  --line-clara:rgba(247,245,233,.16);
  --alerta:#8A5A12;
  --alerta-fundo:#FBF3E2;

  --shadow-lg:0 40px 80px -44px rgba(8,20,12,.55);
  --shadow-sm:0 10px 26px -18px rgba(8,20,12,.45);
  --out:cubic-bezier(.23,1,.32,1);

  --gut:clamp(18px,5vw,44px);
  --max:760px;
  --r-lg:22px;
  --r-md:14px;
  --r-sm:9px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  font-family:'Montserrat',system-ui,-apple-system,sans-serif;
  background:var(--creme);color:var(--tinta);
  line-height:1.68;-webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:2px solid var(--lima);outline-offset:3px;border-radius:6px}
.oculto{display:none !important}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--gut)}

/* ------------------------------------------------------------------ topo */
.topo{
  position:sticky;top:0;z-index:20;
  background:var(--escuro);border-bottom:1px solid var(--line-clara);
}
.topo__in{
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;height:68px;
}
.topo__marca{display:flex;align-items:center;gap:10px;text-decoration:none}
.topo__marca img{height:30px;width:auto}
.topo__marca span{
  font-family:'Rubik',sans-serif;font-weight:600;font-size:.92rem;
  color:var(--creme);letter-spacing:-.01em;
}
@media(max-width:520px){.topo__marca span{display:none}}

.voltar{
  display:inline-flex;align-items:center;gap:8px;flex-shrink:0;
  font-size:.82rem;font-weight:600;color:var(--sobre-escuro);
  text-decoration:none;padding:9px 15px;border-radius:999px;
  border:1px solid var(--line-clara);
  transition:background .28s var(--out),color .28s var(--out),transform .28s var(--out);
}
.voltar svg{transition:transform .3s var(--out)}
.voltar:hover{background:rgba(247,245,233,.09);color:var(--creme)}
.voltar:hover svg{transform:translateX(-3px)}
.voltar:active{transform:scale(.97)}

/* ------------------------------------------------------------- cabeçalho */
.capa{padding:clamp(46px,9vw,84px) 0 clamp(26px,5vw,38px)}
.over{
  font-family:'Rubik',sans-serif;
  font-size:.7rem;font-weight:600;text-transform:uppercase;
  letter-spacing:.16em;color:var(--verde);margin-bottom:14px;
}
h1{
  font-family:'Rubik',sans-serif;font-weight:700;
  font-size:clamp(2rem,6.4vw,3rem);line-height:1.06;
  letter-spacing:-.03em;color:var(--tinta);
}
.capa__sub{
  margin-top:18px;font-size:1.02rem;color:var(--muted);max-width:56ch;
}
.capa__data{
  margin-top:22px;font-size:.8rem;color:var(--muted-2);
  display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;
}
.capa__data b{color:var(--muted);font-weight:600}

/* ---------------------------------------------------------------- sumário */
.sumario{
  background:var(--branco);border-radius:var(--r-lg);
  box-shadow:var(--shadow-lg);padding:clamp(22px,4vw,30px);
  margin-bottom:clamp(38px,7vw,60px);
}
.sumario h2{
  font-family:'Rubik',sans-serif;font-size:.72rem;font-weight:600;
  text-transform:uppercase;letter-spacing:.15em;color:var(--muted-2);
  margin-bottom:16px;
}
.sumario ol{list-style:none;counter-reset:s;display:grid;gap:2px}
.sumario li{counter-increment:s}
.sumario a{
  display:flex;gap:12px;align-items:baseline;
  text-decoration:none;font-size:.93rem;color:var(--tinta);
  padding:8px 10px;margin-inline:-10px;border-radius:var(--r-sm);
  transition:background .24s var(--out),color .24s var(--out);
}
.sumario a::before{
  content:counter(s,decimal-leading-zero);
  font-family:'Rubik',sans-serif;font-size:.72rem;font-weight:600;
  color:var(--muted-2);flex-shrink:0;
  transition:color .24s var(--out);
}
.sumario a:hover{background:var(--verde-fundo);color:var(--verde)}
.sumario a:hover::before{color:var(--verde)}

/* ---------------------------------------------------------------- corpo */
.doc{padding-bottom:clamp(56px,10vw,96px);counter-reset:sec}
.doc section{scroll-margin-top:92px;margin-bottom:clamp(34px,6vw,52px)}
.doc h2{
  counter-increment:sec;
  font-family:'Rubik',sans-serif;font-weight:600;
  font-size:clamp(1.15rem,3.1vw,1.4rem);line-height:1.24;
  letter-spacing:-.02em;margin-bottom:14px;
  display:flex;gap:12px;align-items:baseline;
}
.doc h2::before{
  content:counter(sec,decimal-leading-zero);
  font-size:.74rem;font-weight:600;color:var(--verde);flex-shrink:0;
  position:relative;top:-1px;
}
.doc h3{
  font-family:'Rubik',sans-serif;font-weight:600;font-size:.98rem;
  margin:22px 0 8px;color:var(--tinta);
}
.doc p{margin-bottom:13px;color:var(--muted);font-size:.96rem}
.doc p strong,.doc li strong{color:var(--tinta);font-weight:600}
.doc ul{list-style:none;margin:0 0 14px;display:grid;gap:9px}
.doc ul li{
  position:relative;padding-left:19px;color:var(--muted);font-size:.96rem;
}
.doc ul li::before{
  content:'';position:absolute;left:1px;top:.62em;
  width:6px;height:6px;border-radius:50%;background:var(--lima);
}
.doc a[href]{color:var(--verde);text-decoration:underline;text-underline-offset:3px}
.doc a[href]:hover{text-decoration-thickness:2px}

/* Regra que a lei garante, destacada sem virar cartaz. */
.lei{
  background:var(--verde-fundo);border-radius:var(--r-md);
  padding:16px 18px;margin:16px 0 18px;
  border-left:3px solid var(--verde);
}
.lei p{margin:0;color:#20472C;font-size:.92rem}
.lei p + p{margin-top:8px}

/* Aviso de coisa que ainda não está ligada na loja. */
.nota{
  background:var(--alerta-fundo);border-radius:var(--r-md);
  padding:15px 17px;margin:14px 0 18px;
}
.nota p{margin:0;color:var(--alerta);font-size:.89rem}

/* Dado que a loja ainda não passou. Aparece como lacuna, não como chute. */
.slot{
  display:inline-block;border:1px dashed rgba(18,33,26,.34);
  border-radius:6px;padding:1px 8px;
  font-size:.82em;color:var(--muted-2);font-style:normal;
  white-space:nowrap;
}

/* tabela de terceiros */
.tabela{overflow-x:auto;margin:6px 0 18px;-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%;min-width:560px;font-size:.88rem}
/* Três colunas com largura fixa: sem isso a primeira come o espaço todo e a
   última quebra palavra por palavra. */
th:nth-child(1),td:nth-child(1){width:42%}
th:nth-child(2),td:nth-child(2){width:26%}
th:nth-child(3),td:nth-child(3){width:32%}
th,td{
  text-align:left;padding:11px 14px 11px 0;
  border-bottom:1px solid var(--line);vertical-align:top;line-height:1.5;
}
th{
  font-family:'Rubik',sans-serif;font-weight:600;font-size:.68rem;
  text-transform:uppercase;letter-spacing:.1em;color:var(--muted-2);
  padding-bottom:9px;
}
td{color:var(--muted)}
td:first-child{color:var(--tinta);font-weight:600}
tr:last-child td{border-bottom:0}

/* --------------------------------------------------------------- rodapé */
.pe{background:var(--escuro);color:var(--sobre-escuro);padding:44px 0 34px}
.pe__grid{display:flex;flex-wrap:wrap;gap:22px;justify-content:space-between;align-items:flex-start}
.pe h4{
  font-family:'Rubik',sans-serif;color:var(--creme);font-size:.72rem;
  font-weight:600;text-transform:uppercase;letter-spacing:.13em;margin-bottom:11px;
}
.pe p{font-size:.84rem;max-width:34ch}
.pe ul{list-style:none;display:grid;gap:7px}
.pe li a{font-size:.86rem;text-decoration:none;transition:color .24s var(--out)}
.pe li a:hover{color:var(--creme)}
.pe__fim{
  margin-top:30px;padding-top:18px;border-top:1px solid var(--line-clara);
  font-size:.78rem;color:rgba(247,245,233,.5);
  display:flex;flex-wrap:wrap;gap:6px 18px;justify-content:space-between;
}

.zap{
  display:inline-flex;align-items:center;gap:8px;margin-top:14px;
  background:var(--lima);color:#123020;font-weight:600;font-size:.85rem;
  padding:11px 18px;border-radius:999px;text-decoration:none;
  transition:transform .28s var(--out),box-shadow .28s var(--out);
}
.zap:hover{transform:translateY(-2px);box-shadow:0 14px 28px -16px rgba(126,217,87,.8)}
.zap:active{transform:translateY(0) scale(.98)}
